Как отображать дату и время только в (минутах и ​​секундах)

Question

У меня есть поле формы 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 минут, так что это выглядит прикольно. Кроме того, если мне нужно манипулировать переменной и отправлять значение как отдельную сущность из формы, это прекрасно, но я пытался найти способ избежать этого. Также я использую Angular Template-Driven Forms.

Любая обратная связь будет принята с благодарностью!

Обновление: поле разрывается, потому что поля displayFormat="mm:ss" pickerFormat="mm ss" не распознаются Ionic или используемым форматом ISO DateTime. Так что, возможно, будет достаточно обойти эту проблему?

Answer 1

Отображает текущее время в поле формы, потому что вы создали Date без параметров, поэтому javascript выберет текущую дату и время. Ваш код должен работать, несмотря на неправильное значение.

Что вы можете сделать, чтобы разобраться в этом, так это создать дату с нулевыми миллисекундами, такими как new Date(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();
}