angular - 使用接口仅保存响应中所需的数据

Question

服务器响应返回了很多不必要的数据，我创建了一个界面来仅获取必要的项目，但我不知道该怎么做

我的界面

export interface UsersInfo{
  id: string;
  name: string;
  street: string;
}

我从 API 返回

return this.http.get<any[]>(url, {params, headers})
  .pipe(map((res: any) => {
      return res.items;
    }));

JSON看起来像这样

{
  'id' : 'A457BS',
   [...]
  'info'{
     name: 'John',
     street: '5',
     [...]
   }
}

标签： angularangular7

Answer 1

在响应主体上使用Array.prototype.map()，像这样，对每个元素中的数据进行变异并获取变异数据的数组：

return this.http.get<any[]>(url, {params, headers})
  .pipe(map((res: any) => {
      return res.items.map((item) => {
        return {
          id: item.id,
          name: item.info.name,
          street: item.info.street,
        } as VideosYoutube;
      });
    }));