Есть ли способ установить Angular Material Datepicker day на 1?

Question

Я пытаюсь реализовать Месяц и Год только в Angular Material Datepicker (основываясь на их документах). Я заметил, что по умолчанию он получает текущий день. Например, сегодняшняя дата 13 июня 2019 года, и я выбрал май (месяц) 2019(год), и он возвращается 13 мая 2019 года.

Сейчас я думаю о том, чтобы сделать день по умолчанию равным 1, чтобы он вылился в 1 мая 2019 года, 1 февраля или 1 марта и т. Д. Как бы я это сделал?

ОБНОВЛЕНИЕ: я уже решил эту часть, установив значение, как это в файле компонента

this.form = new FormGroup({
   date: new FormControl(moment().startOf('month'), validators: [Validators.required]
});

Если в случае, если я выбрал 31 мая и предположил, что текущим месяцем является июнь, а не 31, то я ожидаю, что он вернется как 30 июня, но что произойдет, если он стал 1 июня. Это ошибка?

Answer 1

Вы можете использовать использовать monthSelected привязка событий, так что метод будет срабатывать каждый раз, когда вы выбираете месяц.

Во-первых, мы связываем monthSelected событие в onMonthSelect() метод.

<mat-form-field>
  <input matInput [(ngModel)]="selectedDate" (ngModelChange)="onDateSelect($event)" [matDatepicker]="picker" placeholder="Choose a date">
  <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
  <mat-datepicker (monthSelected)="onMonthSelect($event)"  #picker></mat-datepicker>
</mat-form-field>

А на твои component.ts, мы связываем selectedDate так что будет выбран первый день месяца.

onMonthSelect(event) {
  this.selectedDate = new Date(event.getFullYear(), event.getMonth(), 1);
}

Вот демо.