在 Angular 9 中如何强制 http 客户端响应模型中的属性日期类型？

我正在开发 Angular 9 项目，我收到的回复之一包含 type 的属性Date，但是当我发送请求时：

// MyModel
class MyModel {
   prop: string;
   myDate: Date;
}

// request sent like
this.http.get<MyModel>(url);

响应正确，但属性被填充为stringISO 格式（例如：2020-11-24T19:48:20.3637502）（因为在 JSON 中没有类型Date）。 我需要的是，每当我创建一个实例时MyModel或赋值给myDate财产永远是Date.

除了做一个之外还有什么方法可以做到这一点map收到回复后？

我尝试了这个但没有用：

class MyModel {
   prop: string;
   private _myDate: Date;
   public get myDate() {
      return this._myDate;
   };
   public set myDate(val) {
      this._myDate = new Date(val);
   };
}

最简单的方法是映射返回的数据并手动进行修改。

this.httpClient.get<DataModel>("/api/getData")
  .pipe(
    map((data)=>{
      data.date1 = new Date(data.date1);
      data.date2 = new Date(data.date2);
      data.date3 = new Date(data.date3);
      return data;
    })
  );

请注意，我有点作弊 - Date 构造函数可以将字符串和 Date 作为参数。一般来说，映射步骤的结果可以具有与接收到的响应不同的类型。

或者，您可以使用 Http 拦截器。

See Angular 应用程序中的日期处理（第 2 部分 - Angular Http 客户端和 Ngx Datepicker） https://dev.to/imben1109/date-handling-in-angular-application-part-2-angular-http-client-and-ngx-datepicker-3fna

此外，正如您所注意到的，您为 http get 指定的类型不会以任何方式强制执行。您会收到 json 反序列化的结果。

请注意，如果您使用class, not a type作为您的数据模型。即使您收到的字段符合您的预期，原型链也不会建立，因此对收到的对象的任何方法调用都会导致运行时错误。

这也解释了为什么你尝试get and setfailed - 您收到的对象不是实例MyModel class.

我的建议是

• 将响应数据建模为type (or interface)
• 如果需要的话通过 Observable.pipe 转换数据
• 如果您需要一个类作为数据模型，请将响应映射到上一步中的类。