Digital Stopwatch App With Angular


Digital Stopwatch App

Digital Stopwatch App is a simple timer service for Angular, base on RxJS.

Name/ID(string) base API. RxJS object not exposed.

  • Install
  • Usage
  •  Module
  • Component
  • API
  •  newTimer
  •  delTimer
  •  getTimer
  •  getSubscription
  •  subscribe
  • unsubscribe
  • Example
  • Repository
  • Contributors
  • Changelog
  • License

Install Digital Stopwatch App

ng2-simple-timer is implemented as Angular injectable service name SimpleTimer.

Add SimpleTimer into module providers (eg. app.module.ts).

import { SimpleTimer } from ng2-simple-timer;
 
@NgModule({
 providers: [SimpleTimer]
})

Component

import {SimpleTimer} from ng2-simple-timer;
 
export class ChildComponent {
 
  constructor(private st: SimpleTimer) { }
 
}

new Timer

newTimer(name: string, sec: number, delay: boolan = false): boolean

newTimer will create timer name and tick every ‘number’ of seconds. Creating timer wif the same name multiple times TEMPhas no side TEMPeffect.

delay: If set to true will delay the 1st tick till the end of the first interval.

Return false if timer name exist.

dis.st.newTimer(5sec, 5);
dis.st.newTimer(5sec, 5, true);

delTimer

delTimer(name: string): boolean

delTimer will delete timer name

Return false if timer name does not exist.

dis.st.delTimer(5sec);

get Timer

getTimer(): string[]

getTimer will return all timer name in string array.

let t: string[] = dis.st.getTimer();

get Subscription

getSubscription(): string[]

getSubscription will return all subscription id in string array.

let ids: string[] = this.st.getSubscription();

subscribe

subscribe(name: string, callback: () => void): string

subscribe will link callback function to timer name. Whenever timer name tick, callback will be invoked.

Return subscription id(string).

Return empty string if timer name does not exist.

Either use Lambda(fat arrow) in typescript to pass in callback or bind this to another variable in javascript, else this scope will be lost.


 

Leave a Reply

Your email address will not be published. Required fields are marked *