0

我正在尝试仅在 Angular Material Datepicker 中实现月份和年份（基于他们的文档）。我注意到默认情况下，它是当前日期。例如，今天的日期是 2019 年 6 月 13 日，我选择了 2019 年 5 月（月）（年），它返回 2019 年 5 月 13 日。

我现在的想法是将日期默认为 1，这样它将导致 2019 年 5 月 1 日或 2 月 1 日或 3 月 1 日等。我该怎么做？

更新：我已经通过在组件文件中设置这样的值来解决这部分问题

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

如果我选择了 5 月 31 日并假设当前月份是 6 月并且没有 31 日，我希望它会在 6 月 30 日返回，但会发生什么是 6 月 1 日。这是一个错误吗？

4

1 回答 1

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);
}

这是一个演示。

于 2019-06-13T03:23:24.830 回答