如何在 Angular 中更改 mat 日期选择器日期格式？答案

【问题标题】：How to change mat date picker date format in Angular?如何在 Angular 中更改 mat 日期选择器日期格式？
【发布时间】：2019-08-05 11:30:16
【问题描述】：

我正在使用 Angular mat 日期选择器，它工作得很好，但日期的格式不像我想要的那样。

 <mat-form-field class="inputFieldForNewPolicy">
      <mat-label>Change details</mat-label>
      <input matInput name="selectedDate" [matDatepicker]="picker" placeholder="Choose a date" [(ngModel)]="selectedDate">
      <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
      <mat-datepicker #picker></mat-datepicker>
    </mat-form-field>

如果我说，在 ts 文件中：

sendButtonClicked() {
    console.log(this.selectedDate);
  }

结果如下：

2019 年 8 月 17 日星期六 00:00:00 GMT+0300（东欧夏令时间）

我只想要类似的东西

17/08/2019

如何更改格式？ html还是ts？

【问题讨论】：

angular material 2, change datepicker Date Format "MM/DD/YYYY" to "DD/MM/YYYY" strange behavior的可能重复

标签： javascript html angular typescript datepicker

【解决方案1】：

三四种不同类型的设置。我建议应用级别（印度/英国）区域设置。

........
import { NgModule, LOCALE_ID } from '@angular/core';
.......

@NgModule({
  declarations: [
    .....
  ],
  imports: [
    ....
  ],
  providers: [
    ...
    { provide: LOCALE_ID, useValue: 'en-IN' } // en-GB
  ],
  exports: [...],
  bootstrap: [...]
})
export class AppModule {
}




import { DatePipe } from '@angular/common';
......

constructor(
        private datePipe: DatePipe
    ) {}

sendButtonClicked() {
    console.log(this.selectedDate);
    this.selectedDate = this.datePipe.transform(this.selectedDate, 'dd-MM-yyyy');
}

【讨论】：