将HttpResponse强制转换为指定类型的项目,并使用自定义方法

时间:2017-10-19 20:59:36

标签: angular angular4-httpclient

我有一个类,它表示从API返回的数据的结构。我添加了一些便捷方法,它们将逻辑应用于这些字段以返回计算值。

当我使用HttpClient请求数据时,尝试与这些便捷方法交互,它不起作用。我收到一个错误:

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

就好像对象没有被实例化为类Item的实例,只是验证了你从不使用它作为Item之外的任何东西。因此,类定义中定义的所有函数都不会附加到对象。

有没有办法不只是键入检查,而是强制JSON成为Item类型的实际对象?

我想我可以添加一个构造函数来获取泛型对象并将所有字段复制到新对象的字段中。但这不仅看起来非常低效,而且代码气味很大。

是否有一种干净的方法来从HttpClient / HttpResponse返回包含这些便利函数的对象?

我尝试使用Object.assign()作为@DeborahK建议:

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;
  }); 

写入控制台的是一个数组,它包含所有数据,但没有一个元素是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;
  });

这会创建一个Items数组。好极了!问题解决了!谢谢@DeborahK

1 个答案:

答案 0 :(得分:2)

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

在您的.subscribe中,您可以执行以下操作:

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

其中Item是您的班级名称,data是从http请求返回的数据。

这会创建一个新的类实例,并将返回的数据分配给该实例。

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