Component: Calendar isn't show initial value from FormControl/ngModel

[dreyliky]

Describe the bug

The calendar that binded to FormControl isn't shown the initial value from FormControl - check screen.

dateFormat - yy-mm-dd
dataType - string

But then, if I change the date in the overlay by picking the date manually - it updates the value in the "input" element.

Environment

Angular 17, PrimeNG 17.3.3

https://stackblitz.com/edit/4gkycx?file=src%2Fapp%2Fdemo%2Fcalendar-reactive-forms-demo.html

Reproducer

https://stackblitz.com/edit/4gkycx?file=src%2Fapp%2Fdemo%2Fcalendar-reactive-forms-demo.html

Angular version

17.0.5

PrimeNG version

17.3.3

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

20.11.0

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

No response

[davisb10]

I think I found the issue. It was introduced in #14497

That addition now runs the updateModel method, which calls formatDateTime, which then checks if the 'value' is a valid Date object. However, when the value is a string it will return false and then update the value of the form to be null.

This area of the calendar code will need reworked to handle this change.

[cetincakiroglu]

Reverted the PR that breaks the functionality and causes this issue. Related PR is reverted in here #14750

Thanks for reporting the issue!

[PraveenReddy-4e1]

Still it is not working. I am having the date in the ngModel but that is not showing in the calender

[Tsai-Ching]

It is unstable. I am having the date while the ngModel is not showing in the calender from time to time.

[Berejnec]

Still not working. Date is not showing from time to time.

[sdmakwana]

still the same issue occurs I even have date as obj

[heynmi]

At a large cap organization, we are upgrading from Angular 16 -> 18 for our internally facing UI that's critical to company operations.

This issue also is also occurring for us after the upgrade. Deployed environments show the date, upgraded code shows an empty box. We've been testing a lot of different approaches but ultimately are getting an unpopulated calendar.

If the box is clicked on, and a date selected, then it does populate, but not on initialization.

It doesn't seem like it matters how the initial date is passed in - "mm/dd/yyyy", or as a Date object, as @sdmakwana commented.

Does anyone have a fix for this?