react 形式的 Angular 6 日期格式 MM/dd/yyyy

Question

我正在使用具有反应形式的 Angular 6，我正在尝试弄清楚如何格式化从 webapi 返回的日期值。日期显示为 1973-10-10T00:00:00，我想将其格式化为 10/10/1973。下面是检索数据并显示它的代码。 webapi json dob 值为 1973-10-10T00:00:00。模型中的dob值是Date类型。

html

<input formControlName="dob" type="text" [value]="dob | date: 'MM/dd/yyyy'" class="form-control" />

绑定(bind)形式

this.userInfoForm = this.fb.group({
      'userId': ['', [Validators.required]],
      'dob': ['', [Validators.required]]
});

加载保存

this.as.accountUserInfo(this.activeRoute$.ActiveUserId).subscribe(data => {
      this.userInfoModel$ = data as UserInfoModel;
      this.userInfoForm.patchValue(this.userInfoModel$);
});

API 调用

accountUserInfo(userId: number) {
return this.http.post(this.url + "UserInfo", userId)
.pipe(
  retry(3),
  catchError(this.handleError)
)}

对于如何将日期转换为 MM/dd/yyyy 格式的任何帮助或指导，我深表感谢。将 html 设置为日期值确实使它看起来不错，但我不想使用内置的浏览器日期显示，因此我需要将其转换为字符串。

提前致谢。

Answer 1

使用日期选择器时遇到同样的问题。解决方案很简单:将输入类型更改为“日期”

之前:

<input type="text" class="form-control" placeholder="dd/mm/yyyy"
            formControlName="inputNascimento" ngbDatepicker #d="ngbDatepicker">

之后:

<input type="date" class="form-control" placeholder="dd/mm/yyyy"
            formControlName="inputNascimento" ngbDatepicker #d="ngbDatepicker">