angular - 使用 Angular 日期选择器在输入标签中显示自定义日期格式

Question

我已经实现了一个角度日期选择器，它以 ISO 日期格式显示日期。我想将其更改为以欧洲日期格式显示，即“dd.mm.yyyy”。

我尝试在模块中提供语言环境，例如providers: [{ provide: MAT_DATE_LOCALE, useValue: 'DE-EU' }]，它确实改变了格式，但不幸的是，验证不能很好地工作。我的意思是，在将格式更改为欧洲格式之前，它会在错误输入时显示错误，并在输入更正后立即删除错误。更改格式后，它仍然显示错误输入错误，但在更正日期时不会删除它，除非用户单击日历然后选择正确的日期。

<mat-form-field [appearance]="appearance">
  <input
    matInput
    class="om-text-input"
    type="text"
    placeholder="DD.MM.YYYY"
    [required]="isRequired"
    [min]="minDate"
    [max]="maxDate"
    (focus)="Datepicker.open()"
    [matDatepicker]="Datepicker"
    #input="ngModel"
    [(ngModel)]="date"
  />
  <mat-error class="om-error" *ngIf="input.hasError">Min Date Error</mat-error>
  <mat-error class="om-error" *ngIf="input.hasError('matDatepickerMax')">Max Date Error</mat-error>
</mat-form-field>


date: Date = new Date();
  minDate = DateTime.now().minus({ days: 365 }).toISODate();
  maxDate = DateTime.now().plus({ days: 365 }).toISODate();

标签： angulartypescriptdatepickerdate-format