javascript - 如何更改 Angular 中的 mat 日期选择器日期格式?

标签 javascript html angular typescript datepicker

我正在使用 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);
  }

结果如下:

Sat Aug 17 2019 00:00:00 GMT+0300 (Eastern European Summer Time)

我只想要类似的东西

17/08/2019

如何更改格式?在 html 中还是在 ts 中?

最佳答案

三四种不同类型的设置。我有建议的应用程序级别(印度/英国)区域设置。

........
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');
}

关于javascript - 如何更改 Angular 中的 mat 日期选择器日期格式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57357693/

相关文章:

html - 无需使用 Bootstrap 即可响应表数据

php - 如何在常规 PHP/HTML 页面和 Angular 页面之间共享 PHP session ?

javascript - 我如何等待 Angular4 HttpClient 响应?

javascript - Google Analytics 跟踪外部 JS 文件中的代码

javascript - 如何在 Node 中解析 POST 响应体

javascript - 从另一个 observable 内部的 observable 返回对象

angular - 我们可以将 Angular Material v1.x 与 Angular Js 2.x 一起使用吗?

javascript - 通过ajax上传文件的问题

javascript - 我们可以有一个调度程序,您可以异步添加要执行的操作,但将按该顺序同步执行吗?

html - 如何将相对大小的子元素保持在父元素的边界内?