将 HttpResponse 强制转换为指定类型的项，使用自定义方法完成

Question

我有一个 class 代表从 API 返回的数据结构。我添加了几个方便的方法，这些方法将逻辑应用于这些字段以 return 一个计算值。

当我使用 HttpClient 请求数据，然后尝试与那些方便的方法进行交互时，它不起作用。我收到一个错误：

TypeError: item.<method> is not a function. (In 'item.<method>()', 'item.<method>' is undefined)

就好像对象没有被实例化为class Item 的实例，它只是验证了你从来没有将它用作 Item 以外的任何东西。因此，class 定义中定义的所有函数都没有附加到对象。

有没有一种方法不仅可以进行类型检查，还可以强制 JSON 成为 Item 类型的实际对象？

我想我可以添加一个构造函数，它采用通用对象并将所有字段复制到新对象的字段中。但这不仅看起来非常低效，而且还散发着代码的味道。

有没有一种干净的方法可以让 return 从 HttpClient/HttpResponse 编辑的对象包含那些方便的函数？

我尝试按照@DeborahK 的建议使用Object.assign()：

return this.http.get<Item[]>(`${this.apiUrl}/view/projects`, this.options)
  .map( (response: HttpResponse<Item[]>) => {
    var result = Object.assign(new Array<Item>(),response.body);
    console.log( result );
    return result;
  });

写入控制台的是一个数组，它包含所有数据，但是 none 的元素是 Items。可能是因为我没有创建项目数组，而是创建了一个应该包含项目的数组。

所以我修改成这样：

return this.http.get<Item[]>(`${this.apiUrl}/view/projects`, this.options)
  .map( (response: HttpResponse<Item[]>) => {
    var result = response.body.map( (item:Item) => 
      Object.assign(new Item(),item) );
    console.log( result );
    return result;
  });

这将创建一个项目数组。耶！问题解决了！谢谢@DeborahK

Answer 1

HttpClient 在与所提供的 class 或接口匹配的布局中提供数据，但如您所见，它实际上并没有创建 class 本身的实例。

在您的 .subscribe 中，您可以这样做：

Object.assign(new Item(), data);

其中 Item 是您的 class 的名称，data 是从 http 请求返回的数据。

这将创建您的 class 的新实例并将返回的数据分配给该实例。

如果您想提供更多代码，我可以提供更具体的示例。

将 HttpResponse 强制转换为指定类型的项，使用自定义方法完成

Coerce the HttpResponse into an item of the specified type, complete with custom methods

angular

angular4-httpclient