如何在 Angular 6 中将 maxdate 和 mindate 添加到 mat-calendar

Question

我正在使用 Angular 6 材料设计垫日历。我指的是下面的例子。 https://stackblitz.com/edit/angular-mat-calendar?file=src%2Fapp%2Fapp.component.html

但是在 mat-calendar 中如何设置最小和最大比例。

 <mat-calendar [selected]="selectedDate" (selectedChange)="onSelect($event)"></mat-calendar>

我正在尝试像这样添加，但它不起作用。

<mat-calendar [selected]="selectedDate" (selectedChange)="onSelect($event)" [min]="mindate" [max]="maxdate"></mat-calendar>

但这会引发错误“无法绑定到 'min'，因为它不是 'mat-calendar' 的已知属性。”

任何人都可以帮助我。

Answer 1

您需要使用[minDate]不[min]相似[maxDate]

在 HTML 中：

  <mat-calendar [selected]="selectedDate" 
       (selectedChange)="onSelect($event)" 
       [minDate]="minDate" [maxDate]="maxDate"></mat-calendar>

在组件中：

  minDate = new Date(2018, 0, 1);
  maxDate = new Date(2020, 2, 1);

https://stackblitz.com/edit/angular-mat-calendar-pauykr?file=src%2Fapp%2Fapp.component.html