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

Question

我正在使用 Angular 6 material 设计垫日历。我指的是下面的例子。 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

你可以这样试试

**TS**

minDate = new Date(2017, 0, 1);

**HTML**

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

希望对你有所帮助

Answer 2

您需要使用 [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

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

How to add maxdate and mindate to mat-calendar in Angular 6

angular

angular-material-6