Question

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

但是在日历中，如何设置最小和最大比例。

<label>Email address</label>
        <div class="email" formArrayName="partnerEmailArray">
          <div *ngFor="let item of PartnerformEmail.controls; let $index=index" [formGroupName]="$index">
            <input type="text" class="form-text form-control" id="email"
                   formControlName="partnerEmail">                
            <div *ngIf="Partnerform.partnerEmailArray.controls[$index].controls.partnerEmail.touched && Partnerform.partnerEmailArray.controls[$index].controls.partnerEmail.errors">
              <div *ngIf="Partnerform.partnerEmailArray.controls[$index].controls.partnerEmail.errors.required" class="validationMessage">
                Partner Email is required.
              </div>
              <div *ngIf="!Partnerform.partnerEmailArray.controls[$index].controls.partnerEmail.errors.required && Partnerform.partnerEmailArray.controls[$index].controls.partnerEmail.errors.CustomEmail" class="validationMessage">
                Partner Email is invalid.
              </div>
            </div>
          </div>

        </div>

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

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

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

任何人都可以帮助我。

Answer 1

您需要同时使用[minDate]而不是[min]

在HTML中：

[maxDate]

在组件中

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

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

Answer 2

您可以尝试这样

**TS**

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

**HTML**

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

我希望它可以帮助您

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

2 个答案: