Угловой matDatepicker отключает приведение даты

#angular #typescript #angular-material

Вопрос:

Я хочу создать simpleDateFormatterDirective для MatDatepicker и т. Д.: Когда я записывал простые 4 или 6 чисел в календарь, директива заменяла его на реальную дату

0123 -> 2021-01-23
200415 -> 2020-04-15

Но когда я пытаюсь поймать его с размытием, matDatePicker пытается присвоить ему новую дату(входное значение), поэтому я ловлю 0123 — (123-01-01), Могу ли я отключить эту функцию datepicker или у меня есть какая-либо другая идея для реализации этой функции?

 <mat-form-field appearance="fill" class="example-form-field">
  <mat-label>Choose a date</mat-label>
  <input simpleDateFormatterDirective matInput [matDatepicker]="datepicker">
  <mat-datepicker-toggle matSuffix [for]="datepicker"></mat-datepicker-toggle>
  <mat-datepicker #datepicker>
    <mat-datepicker-actions>
      <button mat-button matDatepickerCancel>Cancel</button>
      <button mat-raised-button color="primary" matDatepickerApply>Apply</button>
    </mat-datepicker-actions>
  </mat-datepicker>
</mat-form-field>
 

Ответ №1:

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

Затем вам нужно предоставить этот адаптер на каком — то уровне вашего приложения-будь то корневой или внутри вашего компонента.

Вы можете расширить стандарт NatvieDateAdapter и перезаписать требуемые методы с помощью своей пользовательской логики.

Вам, вероятно, придется также указать MAT_DATE_FORMATS свой код использования — если только вы не закодируете их в своем адаптере.

Комментарии:

1. Большое спасибо!, это работает! Хорошего дня!