离子离子日期时间：如何设置默认选择器值

Question

我有以下需求：最终用户应在空白字段中输入日期时间。由于业务逻辑，该日期时间可以由应用程序建议。所以我想做的是点击空白字段在字段和 ion-datetime 组件中显示建议的日期时间。

这是我的代码：

在 HTML 中

    <ion-datetime   displayFormat='YYYY-MM-DD HH:mm' 
                    pickerFormat='YYYY-MM-DD HH:mm'
                    text-center 
                    (click)="init_worked_time()" 
                    [(ngModel)]='worked_time'>                  
    </ion-datetime>

在打字稿中

init_worked_time() {
    if (this.worked_time == undefined) {
        if (this.times.start_time != 0) { 
            let tzoffset = (new Date()).getTimezoneOffset() * 60000;
            this.worked_time = moment(this.times.start_time).subtract(tzoffset, 'milliseconds').toISOString().slice(0, -1);
        } 
    }
}

问题是建议的值在点击后显示在字段中，但 ion-datetime 组件显示当前 UTC 时间（甚至不是本地时间……）

有没有更好的方法来满足这种需求？或者是否有可能以编程方式更新 ion-datetime 组件的显示值？

谢谢！

Answer 1

您使用的 momentJs 已经默认使用本地时间，因此无需减去偏移量。

init_worked_time() {
    if (this.worked_time == undefined) {
        if (this.times.start_time != 0) { 
            this.worked_time = moment(this.times.start_time).format();
        } 
    }
}

在您的 HTML 中，您需要使用事件 tap 而不是 click：

<ion-datetime displayFormat='YYYY-MM-DD HH:mm' 
                    pickerFormat='YYYY-MM-DD HH:mm'  (tap)="init_worked_time()"
                    text-center 
                    [ngModel]='worked_time'>                  
    </ion-datetime>

这是一个在线DEMO