Question

我试图将我的毫秒转换为可读的小时，分钟，秒格式。我已尝试手动执行此操作，但我遇到了困难，我觉得应该有一种更简单的方法。

当前手动编写的秒表：

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秒。

所以我的问题是，有一种更简单的方法可以实际运作吗？我已经阅读了这篇文章，但我并不完全理解它在我的例子中是如何运作的DatePipe

HTML

<div class="client-time">
    <span>Client time</span>
    <br/>
    <strong>{{hour}}:{{minute}}:{{second}}</strong>    
  </div>
</footer>

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

Answer 1

要将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'}}

Answer 2

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

组件：

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>

在Angular中将毫秒转换为HH：mm：ss格式

2 个答案: