问我想为angular做个计时器

EN

<h3>2. Countdown Timer</h3>
<countdown-timer [countDownTimerConfig]="testConfig"></countdown-timer>
<br>

<button (click)="startTimerGT()">Start with a given time</button>
<button (click)="pauseTimer()">pause</button>
<button (click)="resumeTimer()">Resume</button>
<button (click)="stopTimer()">Stop</button>

import { Component } from '@angular/core';
import {CountdownTimerService } from 'ngx-timer'

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {

  constructor(private countdownTimerService: CountdownTimerService){

  }
  name = 'Angular';
   startTimerGT  = ()=>{
    this.stopTimer();
    let cdate = new Date();   // desired date
    cdate.setHours(cdate.getHours() +  1);
    cdate.setSeconds(cdate.getSeconds() +  5);
    this.countdownTimerService.startTimer(cdate);
  }


   stopTimer = () =>{
    this.countdownTimerService.stopTimer();
  }

  resumeTimer = () =>{
    this.countdownTimerService.resumeTimer();
  }
   pauseTimer = () =>{
    this.countdownTimerService.pauseTimer();
  }
}

import { AppComponent } from './app.component';
import { HelloComponent } from './hello.component';
import { NgxTimerModule } from 'ngx-timer';

@NgModule({
  imports:      [ BrowserModule, FormsModule ,NgxTimerModule],
  declarations: [ AppComponent, HelloComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

npm i srr-elapsedtimer

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
// Import library module
import { ElapsedtimerModule } from "srr-elapsedtimer";
 
@NgModule({
  imports: [
    // ...
    ElapsedtimerModule
  ],
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
export class AppModule {}
Add ElapsedtimerService service wherever you want to use the srr-elapsedtimer.

import { ElapsedtimerService } from "srr-elapsedtimer";
 
class AppComponent implements OnInit {
  constructor(private timer: ElapsedtimerService) {}
 
  ngOnInit() {
    
     this.timer.startTimer(); //This is simple example on how we can use a function
 
  }
}

<srr-elapsedtimer></srr-elapsedtimer>

import { ElapsedtimerService } from "srr-elapsedtimer";
 
class AppComponent implements OnInit {
  constructor(private timer: ElapsedtimerService) {}
 
  ngOnInit() {
    
     this.timer.startTimer(); //This is simple example on how we can use a function
 
  }
}

this.timer.pauseTimer() //Pause the timer
this.timer.resumeTimer() //Resume the timer
this.timer.resetTimer() //Reset the timer

this.timer.delayStart(seconds:number)