1// Iinstall the timer package from NPM
2$ npm install angular-countdown-timer --save
3
4// Import the countdown timer module
5import { NgModule } from '@angular/core';
6import { CountdownTimerModule } from 'angular-countdown-timer';
7
8@NgModule({
9 imports: [
10 CountdownTimerModule.forRoot()
11 ]
12})
13export class YourModule { }
14
15// Your component TS file
16import { Component } from '@angular/core';
17
18@Component({
19 selector: 'app-your',
20 templateUrl: './your.component.html',
21 styleUrls: [ './your.component.css' ]
22})
23export class YourComponent {
24 date = new Date('2019-01-26T00:00:00');
25
26 triggerFunction() {
27 console.log('Timer Ended');
28 }
29
30}
31
32// Use the timer in your component html
33<h1>{{title}}</h1>
34
35Timer mode:
36<countdown-timer [start]="date"></countdown-timer>
37
38Countdown:
39<countdown-timer [end]="date"></countdown-timer>
40
41Countdown with zero trigger:
42<countdown-timer (zeroTrigger)="triggerFunction()" [end]="date"></countdown-timer>
43
1//Install npm package:
2$ npm install ngx-countdown --save
3
4//Import in ngModule:
5...
6import { CountdownModule } from 'ngx-countdown';
7...
8@NgModule({
9 ...
10 imports: [
11 ...
12 CountdownModule
13 ],
14 ...
15)}
16
17//Use in the component.html
18<countdown [config]="{ leftTime: 100, format: 'm:s' }"></countdown>