Как использовать ngModel со средством выбора даты материала angular, если приложение использует язык, отличный от используемого по умолчанию? - PullRequest
Новая
       35

Как использовать ngModel со средством выбора даты материала angular, если приложение использует язык, отличный от используемого по умолчанию?

0 голосов
/ 25 октября 2019

Возьмите в качестве эталона мой образец:

https://stackblitz.com/edit/angular-xnrjnx?file=app/datepicker-formats-example.ts

Как видите, я меняю локаль angular на app.module.ts 

providers: [
    { provide: MAT_DATE_LOCALE, useValue: 'fr-FR' },
    {
      provide: LOCALE_ID, useValue: 'fr-FR'
    }
  ]

С учетом этого изменения, когда я выбираю дату, она автоматически форматируется как ДД / ММ / ГГГГ, а не ММ / ДД / ГГГГ - это то, что я ожидал.

Но если вы попытаетесь ввести дату вручную, вам придется использовать угловой формат по умолчанию (ММ / ДД / ГГГГ)

Моя цель - обеспечить согласованность и когда пользователь обновляет вручнуюэто значение, тот же формат должен быть использован.

Возможно ли это сделать с помощью ngModel?

1 Ответ

0 голосов
/ 30 октября 2019

вы можете заблокировать ввод текста пользователем, чтобы избежать дополнительных ошибок и условий. Пожалуйста, вставьте этот код в ваш пример, чтобы увидеть результат. 

<mat-form-field>
  <input #input matInput (focus)="dp.open(); input.blur()" [matDatepicker]="dp" placeholder="Verbose datepicker" [(ngModel)]="date">
  <mat-datepicker-toggle matSuffix [for]="dp"></mat-datepicker-toggle>
  <mat-datepicker #dp></mat-datepicker>
</mat-form-field>
...