Calendar: Property `[defaultDate]` makes the calendar unresponsive in reactive forms

[ThoSap]

Describe the bug

When the PrimeNG Calendar is used with Angular reactive forms, setting the input binding [defaultDate] makes the Calendar unresponsive and the user can no longer select a date, month, or year.

Environment

StackBlitz - PrimeNG CalendarReactiveFormsDemo [defaultDate] broken

Reproducer

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

Angular version

17.3.6 and 17.3.1 (from StackBlitz)

PrimeNG version

17.15.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v20.11.1

Browser(s)

Chrome 123.0.6312.124

Steps to reproduce the behavior

StackBlitz - PrimeNG CalendarReactiveFormsDemo [defaultDate] broken

Expected behavior

The PrimeNG Calendar should work with Angular reactive forms when the input binding [defaultDate] is set.

[ThoSap]

My current workaround is the following, remove the input binding [defaultDate] from the template and set the internal _defaultDate in the AfterViewInit lifecycle. See StackBlitz - PrimeNG CalendarReactiveFormsDemo [defaultDate] workaround

  @ViewChild('myCalendar')
  private myCalendar!: Calendar;

  ngAfterViewInit(): void {
    // Workaround for the buggy <p-calendar [defaultDate]="getMaxDate()"> property binding in reactive forms
    this.myCalendar._defaultDate = this.getMaxDate();
  }

<form [formGroup]="formGroup">
  <p-calendar #myCalendar formControlName="date"/>
</form>

[ThoSap]

@cetincakiroglu this is still an issue with PrimeNG v17.18.9