时间戳

首页 > 解决方案 > 角度 4 - 以分钟为单位的可观察计时器

javascript - 角度 4 - 以分钟为单位的可观察计时器

问题描述

如何以分钟而不是秒显示我的计时器？

这是我得到的：

export class CustomHeader {

  countDown;
  counter = 36000;

  constructor(private toastCtrl: ToastController,public loadingCtrl: LoadingController,private alertCtrl: AlertController,public app: App,public viewCtrl: ViewController, public navCtrl: NavController, private webService: WebService, public modalCtrl: ModalController, public auth0: Auth0ServiceProvider, private globalVarsService: GlobalVarsService) {
    this.countDown = Observable.timer(0,1000)
    .take(this.counter)
    .map(() => --this.counter);
  }

}

在我的 html 中：

<span ion-text>{{countDown  | async}}</span>

它正在工作，但显示如下：35999... 35998...

有没有办法在几分钟而不是几秒钟内显示数据？

标签： javascriptangularionic-frameworkionic3

解决方案

您想使用Angular Decimal Pipe，因此您的代码将如下所示：

<span ion-text>{{countDown/60 | number: '1.0-0'}}:{{countDown%60}}</span>

倒计时除以 60 以获得分钟，然后通过管道运行以显示至少 1 个整数和 0 个小数。

您可以使用 % 操作获得剩余的秒数。

推荐阅读