Html 以角度将毫秒转换为HH:mm:ss格式

我正在尝试将毫秒转换为可读的小时、分钟、秒格式。我尝试过手动操作，但是我被卡住了，我觉得应该有一个更简单的方法

当前手动写入的秒表：

ngOnInit(){
    //alert(this.datePipe.transform(new Date()));

    let timer = Observable.timer(0, 1000);
    timer.subscribe(t=>{
        this.today = this.datePipe.transform(t);
        this.second = t;
        if(this.second==60){
            this.second = 0;
            this.minute += 1;
        }else if(this.minute == 60){
            this.minute = 0;
            this.hour += 1;
        }

    });
}

一旦t超过60秒，秒将不会重置，它将继续超过60秒

所以我的问题是，有没有一种更简单的方法能真正起作用？我读过这篇文章，但我不太明白它在我的示例中是如何工作的

HTML

客户时间


{{hour}}:{{minute}:{{{second}}

---

基本上，我试图显示用户在页面上的时间。

要将DatePipe与时间结合使用，请查看以下内容：

  start = new Date(0,0,0);

  ngOnInit() {
    Observable.interval(1000)
      .startWith(0)
      .subscribe(t => {
        this.start = new Date(0, 0, 0);
        this.start.setSeconds(t);
      });
  }

HTML应该是

{{start | date:'HH:mm:ss'}}

---

以下是一个简单的版本，以秒为单位显示时间：

组成部分：

模板：

客户端时间

{{计数器|日期：'HH:mm:ss'}}秒

以秒为单位显示时间不是问题，因为this.timer=Observable.timer（01000）；他已经在做了。我想展示小时和分钟以及seconds@Fig，请稍等，代码有问题-请立即修复：）@Fig，正在运行，请尝试一下，并让我们知道：）谢谢！这正是我想要的，我知道我应该使用管道功能，但不知道如何使用。这很好用！再次感谢！我唯一的问题是秒数从14开始

{{start | date:'HH:mm:ss'}}

private timer;
private counter: Date;

ngOnInit() {
  this.timer = Observable.timer(0,1000)
    .subscribe(t => {
      this.counter = new Date(0,0,0,0,0,0);
      this.counter.setSeconds(t);
    });
}

ngOnDestroy(){
  this.timer.unsubscribe();
}

<div class="client-time">
  <span>Client time</span><br/>
  <strong>{{counter | date:'HH:mm:ss'}} seconds</strong>    
</div>