primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.28k stars 4.56k forks source link

Calendar Component: Date not showing if date is before [mindate] #16262

Open sdmakwana opened 1 month ago

sdmakwana commented 1 month ago

Describe the bug

In my angular project, p-calendar does not show date if the date assigned to it is before the mindate value. I have migrated my project from angular 15 to angular 18. This issue does not occur in 17.0.0 of primeng but does occur in the latest version but I must use the latest version because of angular 18 compatibility.

Environment

"@angular/cdk": "^18.1.0", "@angular/common": "^18.1.0", "angular/compiler": "^18.1.0", "@angular/core": "^18.1.0", "@angular/forms": "^18.1.0", "primeng": "17.18.9",

Reproducer

No response

Angular version

18.1.0

PrimeNG version

17.18.9

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v20.16.0

Browser(s)

Chrome

Steps to reproduce the behavior

<p-calendar [(ngModel)]="startDate" [mindate]="mindate">p-calendar> startDate = new Date(Date.now() - 86400000); // yesterday. mindate = new Date() // Todays date.

Expected behavior

No response

jonnomk commented 1 month ago

I also have this issue with the calendar

vborutenko7 commented 1 month ago

+1 , We have the same issue. Here is the case. We have some form that supports add/edit operation. On this form, we have a calendar with minDate = new Date(). During creation, we set the date through the calendar to current date + 1 day and create some entity. We come to this form in 2 days and try to edit the entity. And we don't see the date in the input as it is in the past.

sdmakwana commented 1 month ago

Is it the new changeDetection change in angular or is the issue from package side? Because I remember seeing this issue in previous versions.
Also, not using onPush BTW.

ibrahimkelly commented 1 month ago

Check the format of your date, ensure that the date format remain the same when changed. Thanks

ibrahimkelly commented 1 month ago

Is it the new changeDetection change in angular or is the issue from package side? Because I remember seeing this issue in previous versions.
Also, not using onPush BTW.

I sometimes use fromatDate method from angular common.

sdmakwana commented 1 month ago

Switched to matDatePicker.

topce commented 1 month ago

@sdmakwana @jonnomk @vborutenko7
On latest version of primeng you can try to add attribute to p-calendar : [keepInvalid]="true"

jonnomk commented 1 month ago

@sdmakwana @jonnomk @vborutenko7 On latest version of primeng you can try to add attribute to p-calendar : [keepInvalid]="true"

Oh, ok. That's helpful, thank you.

sdmakwana commented 1 month ago

@sdmakwana @jonnomk @vborutenko7 On latest version of primeng you can try to add attribute to p-calendar : [keepInvalid]="true"

Bro you are a life saver