如何仅在(分钟和秒)中显示日期时间

时间:2018-08-28 16:31:02

标签: javascript angular datetime ionic3

我有一个ion-datetime表单域,用户可以选择分钟和秒。但是,由于某种原因,表单字段始终显示为空白。我知道答案与javascript Date()函数有关,但似乎无法获得想要的结果。

<ion-item class="formField">
      <ion-label stacked>Time</ion-label>
      <ion-label class="warningLabel">(Max of 5 minutes)</ion-label>
      <ion-datetime
          ngModel
          minuteValues="0,1,2,3,4,5"
          displayFormat="mm:ss"
          pickerFormat="mm ss"
          name="selectedTime"
          placeholder=""
          type="date">
      </ion-datetime>
</ion-item>

我尝试将selectedTime:any = new Date().toISOString();[(ngModel)]="selectedTime"一起使用,但是它已经在表单字段中显示了当前时间。我在现场的最长时间是5分钟,所以看起来很时髦。另外,如果我需要操纵变量并将值作为一个很好的形式从单独的实体发送出去,但我试图找到一种避免这种情况的方法。另外,我正在使用角度模板驱动的窗体。

任何反馈将不胜感激!

更新:该字段中断,因为Ionic或所使用的ISO日期时间格式无法识别displayFormat="mm:ss" pickerFormat="mm ss"字段。那么也许解决这个问题就足够了吗?

1 个答案:

答案 0 :(得分:2)

它在表单字段中显示当前时间,因为您实例化了没有参数的Date,因此,javascript将选择当前日期和时间。尽管值有误,您的代码仍可以正常工作。

解决这个问题的方法是用0毫秒实例化一个日期,例如new Date(0),那么您将得到0分钟0秒,这对于您描述timespan来说更有意义。

import { Component } from '@angular/core';

@Component({
  selector: 'page-home',
  template: `
    <ion-content padding>
      <ion-datetime
        [(ngModel)]="myDate"
        minuteValues="0,1,2,3,4,5"
        displayFormat="mm:ss"
        pickerFormat="mm ss">
      </ion-datetime>
    </ion-content>
  `
})
export class HomePage {
  myDate = new Date(0).toISOString();
}