首页 > 解决方案 > 如何在 ngx-countdown 中将数据动态绑定到 leftTime

问题描述

我正在使用 ngx-countdown npm 包在我的网页上显示倒计时。我想根据来自后端的数据设置 leftTime 属性,我尝试了以下方式,但它不起作用,

在我的html中,

<countdown #cd [config]="notifyConfig" (event)="handleEvent($event)"></countdown>

在我的 component.ts

notifyConfig: CountdownConfig = { leftTime: this.consultationDurationInSeconds, notify: [120], format: 'mm:ss', };

this.consultationDurationInSeconds = data.ConsultationDuration.Minutes*60;

我的数据对象有我想绑定到 leftTime 属性的分钟。但是当我尝试这种方式时,它会显示错误消息,

** 无法将“无效日期”转换为日期 **,

谁能帮我解决这个问题?

标签: typescriptcountdownangular9

解决方案


你可以这样做

首先声明一个包含你想要的时间的字符串,

let TimeString = "20:00";

  startCountDown() {
    if (this.timer > 0) {
      this.TimeString = this.getFormattedTime();
      this.timer--;
    }
  }

  getFormattedTime() {
    const duration = moment.duration(this.timer, 'seconds');
    const resultstring = moment.utc(duration.asMilliseconds()).format('mm:ss');

    return resultstring;
  }

您只想调用 startCountDown() 函数。


推荐阅读