0

There was an issue with the mat-datepicker a year back where the user saved a date value and refreshes the page we moved backwards by 1 day

We fetch the unix timestamp value ex: 1671235200000 from BE and display the value (display the UK date).

i.e.

   <input
                         (click)="pickerDate.open()"
                         type="text"
                         class="form-control"
                         id="datetest"
                         formControlName="datetest"
                         [matDatepicker]="picker"
                         placeholder="date"
                       />
                       <mat-datepicker #picker></mat-datepicker>

The fix was

 this.formgroup
           .get('datetest')
           .setValue(DateTime.fromMillis(unixTimestamp as number).setZone("Europe/London").toFormat("dd MMM yyyy"));

and it worked properly. Since then we upgraded to Angular 14 and the corresponding material framework and the issue seems to have reappeared again.

  • The issue seems to have reappeared and reverting back to this.livestreamForm.get('datetest').setValue(new Date(unixTimestamp)) does the trick

  • The issue is only the input is set to date before but the calendar sets the correct date. The issue happens in all pages with non BST timezone.

  • Intrestingly there is another page in a different module which still works fine with the DateTime.fromMillis(unixTimestamp as number) logic.

  • dateLocale is set to en-GB for both pages by this

providers: [{ provide: MAT_DATE_LOCALE, useValue: 'en-GB' }]

,

Any ideas what could affect the input but not the mat-datepicker?

adarsh
  • 1
  • 1

1 Answers1

0

I figured out that I was importing a shared module that had its own implementation of DateAdapter that was leaking to all mat-datepicker controls

adarsh
  • 1
  • 1