angularangular-materialangular-daterangepicker

Angular Material DateRangePicker change top left date format


Who knows how to change format in image below

enter image description here

my AppDateAdapter:

export class AppDateAdapter extends NativeDateAdapter {
  // tslint:disable-next-line:no-any
  format(date: Date, displayFormat: any): string {
    if (displayFormat === 'input') {
      let day: string = date.getDate().toString();
      day = +day < 10 ? '0' + day : day;
      let month: string = (date.getMonth() + 1).toString();
      month = +month < 10 ? '0' + month : month;
      const year = date.getFullYear();
      return `${day}.${month}.${year}`;
    }
    return date.toDateString();
  }
  getFirstDayOfWeek(): number {
    return 1;
  }
}

Solution

  • You can see this example. Here they change the custom header format.

    https://stackblitz.com/angular/odbaekyldjn?file=src%2Fapp%2Fdatepicker-custom-header-example.ts