CODEWITHSUNDEEP
angularangular-material
Felix Christo
Felix Christo

Reputation: 287

Max date for mat-calendar

I was using <mat-calendar> long back. I took now and tried to set maxDate (i.e) disabling all previous dates. But now I found now support for .

Code

   <mat-calendar name="appointment_date" [maxDate]="maxDate"  [selected]="selectDate" (selectedChange)="onSelect($event)">
            </mat-calendar>

maxDate = new Date();

I also tried with[max] but not working out. Please help me out

Upvotes: 0

Views: 711

Answers (2)

denyoha
denyoha

Reputation: 183

This works for disabling previous dates:

Try this in your html:

<mat-calendar name="appointment_date" [min]="minDate" [selected]="selectDate" 
              (selectedChange)="onSelect($event)">
</mat-calendar>

And this in your component.ts:

  minDate = new Date();

Upvotes: 1

Hien Nguyen
Hien Nguyen

Reputation: 18965

You need check the maxDate variable value and format.

I tried to reproduce [maxDate] property it worked.

https://stackblitz.com/edit/angular-mat-calendar-ggs5ha

Upvotes: 1

Related Questions