Question

我正在使用以下方法在我的应用中显示时间？

constructor(private datePipe: DatePipe) {}
ngOnInit() {
    this.getTime();
    this.date = this.datePipe.transform(new Date(), "dd/MM/yyyy");
  }
 getTime() {
    setInterval(() => {
      this.time = this.datePipe.transform(new Date(), "HH:mm:ss");
      this.getTime();
    }, 1000);
  }

此代码可以正常工作，但是一段时间后应用程序崩溃了。有没有其他方法可以在angular4 / 5/6中显示时间？

Answer 1

内部component.ts

time = new Date();

ngOnInit() {
    setInterval(() => {
       this.time = new Date();
    }, 1000);
}

内部component.html

{{ time | date: 'hh:mm:ss a' }}

工作demo

Answer 2

使用可观察的“ onPush”变更检测的替代方法

Id

Answer 3

或者，您可以使用可观察对象：

private _time$: Observable<Date> = timer(0, 1000).pipe(
  map(tick => new Date()),
  shareReplay(1)
);

get time() {
  return this._time$;
}

在您的html中：

{{ time | async | date: 'hh:mm:ss a' }}

以角度显示时间/时钟

3 个答案: