Метод mat-datepicker обычно используется в приложениях Angular для отображения компонента выбора даты. Формат «дд-ммм-гггг» относится к желаемому формату отображаемой даты. Вот несколько способов добиться этого:

1. Использование канала передачи данных Angular. Вы можете использовать канал передачи данных Angular для форматирования даты в нужном формате. В своем коде вы должны предоставить каналу данных формат «дд-МММ-гггг». Например:

   <input matInput [matDatepicker]="picker">
   <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
   <mat-datepicker #picker></mat-datepicker>

   import { Component } from '@angular/core';
   @Component({
   selector: 'app-date-picker',
   templateUrl: './date-picker.component.html',
   styleUrls: ['./date-picker.component.css']
   })
   export class DatePickerComponent {
   today: Date = new Date();
   }

   <p>Selected Date: {{ today | date:'dd-MMM-yyyy' }}</p>

2. Пользовательская функция форматирования. Вы также можете создать в своем компоненте пользовательскую функцию для форматирования даты. Вот пример:

   <input matInput [matDatepicker]="picker">
   <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
   <mat-datepicker #picker></mat-datepicker>

   import { Component } from '@angular/core';
   import { formatDate } from '@angular/common';
   @Component({
   selector: 'app-date-picker',
   templateUrl: './date-picker.component.html',
   styleUrls: ['./date-picker.component.css']
   })
   export class DatePickerComponent {
   today: Date = new Date();
   formatDate(date: Date): string {
   return formatDate(date, 'dd-MMM-yyyy', 'en-US');
   }
   }

   <p>Selected Date: {{ formatDate(today) }}</p>

3. Сторонние библиотеки. Вы также можете использовать сторонние библиотеки выбора даты, предоставляющие возможности настройки, например ngx-bootstrap или ng-bootstrap.