Как получить заранее выбранное время на 12-часовом формате Ionic 3

Question

Я пытаюсь получить значение по умолчанию для полей времени в моей форме.К сожалению, мне не повезло, пытаясь заставить его работать.

.html

      <ion-item class="formField ionField">
        <ion-label color="primary" stacked>START TIME</ion-label>
        <ion-datetime
        type="time"
        name="startTime"
        displayFormat="h:mm A"
        pickerFormat="h:mm A"
        minuteValues="0,15,30,45"
        [(ngModel)]="defaultStartTime">
        </ion-datetime>
      </ion-item>

      <ion-item class="formField ionField">
        <ion-label color="primary" stacked>END TIME</ion-label>
        <ion-datetime
        type="date"
        name="endTime"
        displayFormat="h:mm A"
        minuteValues="0,15,30,45"
        [(ngModel)]="defaultEndTime"></ion-datetime>
      </ion-item>

.ts

defaultStartTime:any = new Date (new Date().toDateString() + ' ' + '5:00 AM').toISOString();
defaultEndTime:any = new Date (new Date().toDateString() + ' ' + '7:00 PM').toISOString();

Это то, что он выводит.Я знаю, что это связано с .getTimezoneOffset();, но я продолжаю получать ошибки.Любая помощь будет оценена.

Обновление:

defaultStartTime: string = new Date(new Date().setHours(5, 0, 0)).toISOString();
defaultEndTime: string = new Date(new Date().setHours(19, 0, 0)).toISOString();

Answer 1

Вы должны смотреть на изменение форматирования только на уровне шаблона, а не в компоненте.

Изменить это:

defaultStartTime:any = new Date (new Date().toDateString() + ' ' + '5:00 AM').toISOString();
defaultEndTime:any = new Date (new Date().toDateString() + ' ' + '7:00 PM').toISOString();

к этому:

defaultStartTime: string = new Date(new Date().setHours(5, 0, 0)).toISOString();
defaultEndTime: string = new Date(new Date().setHours(19, 0, 0)).toISOString();

И измените свой шаблон так:

      <ion-item class="formField ionField">
        <ion-label color="primary" stacked>START TIME</ion-label>
        <ion-datetime
        type="date"
        name="startTime"
        displayFormat="DDD MMM DD YYYY h:mm A"
        pickerFormat="h:mm A"
        minuteValues="0,15,30,45"
        [(ngModel)]="defaultStartTime">
        </ion-datetime>
      </ion-item>

      <ion-item class="formField ionField">
        <ion-label color="primary" stacked>END TIME</ion-label>
        <ion-datetime
        type="date"
        name="endTime"
        displayFormat="DDD MMM DD YYYY h:mm A"
        minuteValues="0,15,30,45"
        [(ngModel)]="defaultEndTime"></ion-datetime>
      </ion-item>

Больше информации на официальных документах: https://ionicframework.com/docs/api/components/datetime/DateTime/#display-format