以角度将日期格式从 dd/mm/yyyy 更改为 dd-mm-yyyy答案

【问题标题】：change the date format from dd/mm/yyyy to dd-mm-yyyy in angular以角度将日期格式从 dd/mm/yyyy 更改为 dd-mm-yyyy
【发布时间】：2021-11-08 11:01:06
【问题描述】：

我想将日期格式从 dd/mm/yyyy 更改为 dd-mm-yyyy 请查看参考图像一次以清楚起见：

HTML

<div fxFlex="calc(25% - 30px)">
  <mat-form-field appearance="outline" class="w-100">
    <mat-label>Date of birth</mat-label>
    <input matInput type="date" [formControlName]="'dateOfBirth'" placeholder="Select entry date" required>
    <mat-error *ngIf="dateFormat">
      <strong>Kindly enter a valid date</strong>
    </mat-error>
  </mat-form-field>
</div>

dateFormat: boolean;

validateDate() {
  if (this.memberForm.get('dateOfBirth').value == '') {
    this.dateFormat = true;
  }
}

ngOnInit() {
  this.validateDate();
}

【问题讨论】：

您使用的是input type="date"，它有一些限制。那里说“显示的日期是根据用户浏览器的语言环境格式化的”而且似乎没有办法自定义它，所以我猜你不能使用浏览器的本机日期选择器来满足这个要求。但是，后面的value 格式始终相同。
意味着我们不能更改由有角的人创建的默认日期格式吗？
这与 Angular 无关。正如我所说，您使用的是浏览器的本机日期输入字段，它有我提到的限制。要么你忍受它，要么你需要使用完全不同的组件，例如Angular Material's Datepicker
这能回答你的问题吗？ Is there any way to change input type="date" format?

标签： html datepicker

【解决方案1】：

import { DatePipe } from '@angular/common'
...
constructor(public datepipe: DatePipe){}
...
myFunction(){
this.date=new Date();
let latest_date =this.datepipe.transform(this.date, 'yyyy-MM-dd');
}

只需在 app.module.ts 的 'providers' 数组中添加 Datepipe。像这样：

import { DatePipe } from '@angular/common'
...
providers: [DatePipe]

【讨论】：

抱歉无法使用，能否请您在 stackblitz 中提供解决方案