如何处理 REST API 返回对象而不是 AngularJS 中的集合数组？

Question

与我合作的后端团队实现了一个 REST API，它将集合作为对象（而不是数组）返回。例如，调用GET /some_resources将返回：

{
  id_1: {
          p1: "lorem",
          p2: 4 
        }, 
  id_2: {
          p1: "ipsum", 
          p2: 2
        }, 
  id_n: {
          p1: "sic", 
          p2: 7
        }
}

这种结构仅限于在 Angular 中使用，因为例如您不能利用ng-repeat指令（例如orderBy 和 filter 不适用于 object）。

对于前面的例子，理想情况下，我宁愿期望一个对象数组：

[ 
  {id: "id_1", p1: "lorem", p2: 4},
  {id: "id_2", p1: "ipsum", p2: 2},
  {id: "id_n", p1: "sic", p2: 7}
]

这将允许直接使用ngResource服务返回的对象并将其发送回来，而无需触及其结构。它还允许完全使用ng-repeat指令。

当我要求后端团队将他们的集合响应结构从对象更改为数组时，他们认为 API 使用者不应主导响应结构的设计。

我部分同意他们的论点，所以现在，我找到的唯一解决方案是将对象转换为数组，将此对象处理到我的作用域中，然后将数组重新转换回原始对象结构，然后再将其发送回 API .

这导致了很多代码样板，我想知道是否有一种“角度方式”来处理这种情况。

Answer 1

“他们认为 API 使用者不应主导响应结构的设计”

反驳 - 如果当前 API 的唯一使用者是前端，那么在添加其他使用者之前，他们有时间将其放入正确的格式。该数据非常适合作为数组而不是对象。我不知道您的数据集可能有多大，但您将来不想做的一件事是在前端操作对象（无论大小）。浏览器资源有限，服务器总是可以添加资源。

Answer 2

更新

let resource = {
  id_1: {
          p1: "lorem",
          p2: 4 
        }, 
  id_2: {
          p1: "ipsum", 
          p2: 2
        }, 
  id_n: {
          p1: "sic", 
          p2: 7
        }
}
let model = [];

Object.keys(resource).forEach(
    key=>{
        let o = resource[key];
        o['id'] = key;
        model.push(o)
    }
);

将其应用到您的资源后，输出将是一个数组，其中包含键id, p1，p2符合您的首选格式。使用完模型后，您可以将其恢复为原始格式：

let original={};
model.forEach(o => original[o.id] = {p1:o.p1, p2:o.p2});

原答案

我不知道“角度方式”。我使用下面的代码来处理类似的情况。这是打字稿，但可以很容易地适应 JavaScript。它的灵感来自 David Sherret 的代码

getObjValues(e: any) {
    return Object.keys(e).map(k => e[k]);
}

let resource = {
  id_1: {
          p1: "lorem",
          p2: 4 
        }, 
  id_2: {
          p1: "ipsum", 
          p2: 2
        }, 
  id_n: {
          p1: "sic", 
          p2: 7
        }
}

let model = getObjValues(resource)

modelp1将是一个带有键和的元素数组p2。如果您需要恢复原始对象，则需要更多代码来保存初始对象id_1并id_2重建原始对象。