Angular & PrimeNg Datepicker (p-calendar): Disable future dates

380 views Asked by At

I am trying to use primeNG datepicker to select the dates and I need to disable all the future dates (not including today) except the [maxDate] input is not working, actuall if I apply it it disables all the dates. I have read the documentation and all the related / similar questions on StackOwerflow the problem maybe comes from the fact that I use NgModel but unfortunately I have no other choice than to use it! I have also tried to define min and max dates but if I define min date like this:

 minDate = new Date(1900, 0, 1) 

It still disables all the dates...

My code:

maxDate = new Date()

        <p-calendar 
          [(ngModel)]="dateSince" 
          [showIcon]="true" inputId="icon" 
          [maxDate]="maxDate"></p-calendar>

I have tried different formatting of the date even with momentJS but I always get the error that String is not assignable to Date even after I use .toISOString() I have tried even to difine disabledDates but this is also not working.

Version of the PrimeNg is: "^12.0.0" (also I can't modify this) Thanks

1

There are 1 answers

0
Adrian On BEST ANSWER

I had a similar issue with my code, whenever I tried to use maxDate I couldn't select anything and the calendar would freeze. From experimenting with ways of setting that maxDate, I figured it out that in my case it was freezing because I was trying to use a setter in my component which was being called indefinitely. I moved everything to ngOnInit and then it worked. Also instantating the variable with the date directly seemed to do the job as well