如何将角度材料日期选择器中的日期作为字符串绑定到模型？

Question

我们使用标准日期选择器组件，来自 Angular material (v. 9.1.2)，如下所示：

<mat-form-field>
    <mat-label i18n>Date of birth</mat-label>
    <input matInput [matDatepicker]="picker" formControlName="dateOfBirth" />
    <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
    <mat-datepicker #picker></mat-datepicker>
</mat-form-field>

日期采用 ISO 格式，例如1979-12-02. 一旦绑定到表单并显示出来，我们就可以通过调用getRawValue整个表单来恢复它。但是，这Date会将日期作为 javascript 返回，然后将其转换为字符串并以“完整”ISO 格式发送到后端，例如1979-12-02TXX:00:00.000Z，这会破坏联系人/API。

如果我们使用MatMomentDateModule代替MatNativeDateModule，我们会返回一个 js 日期（而不是 javascript Date），但这对格式化没有帮助。

有没有办法将控件的原始值绑定为字符串而不是日期？最好不要将组件包裹在ControlValueAccessor? 也许是习俗DateAdapter？

Answer 1

在将对象发送到 api 之前，手动对其进行字符串化，如下所示：-

const req = JSON.stringify(reqObj, (key: any, value: any) => {
          if (JSON.parse(JSON.stringify(moment(value))) === value) {
            return moment(value).format("yyyy/MM/DD");
          } else {
            return value;
          }
        });

并将请求发送到 api。这会将请求对象中的任何时刻日期转换为您所需的格式。