java - 使用嵌套数组遍历 AngularJS 资源

Question

我有一个小型 Web 应用程序，它在前端使用 AngularJS，在后端使用 Java。我正在使用 REST 进行通信。

在后端我正在创建一个列表列表，如下所示:

        List<List<Data>> allData = new ArrayList<>();
        allData.add(firstList);
        allData.add(secondList);

当它到达前端时，它看起来像下面的屏幕截图 - 即不是一个 Array[] 对象中的 2 个 Array[] 对象，而是这些 Resource 对象中的 2 个具有 Array[] 列表对象。问题是我现在想遍历这个数组列表，但我不知道如何从这个 Resource 对象中获取列表的长度!我已经尝试过长度、大小、计数……都是未定义的。

问题是我怎样才能让它保持在一个数组结构中，这样我就可以轻松地迭代？或者如何从 Resource 对象获取长度？

TIA(请原谅新手问题)。

扩展其中一个资源节点:

Answer 1

您遇到的行为在某种程度上与以下事实有关:在 $resource query() 中，预期的响应数据是一个数组，其中的每个数据项数组被转换为一个资源对象，其中包含带有后缀 $ 的实例操作方法。

• Resource Object Conversion Reference
• Resource Object Reference

正如您在上面的资源对象引用中看到的，它执行 shallowClearAndCopy() 数组中数据项的副本，使用 for..in 将数据项的所有属性扩充到资源对象本身。 只迭代 enumerable 属性。自 Array.length 不是可枚举属性，则不会从数组数据项中扩充 Resource 对象中的 length 属性。

您可以通过三种方式来解决这个问题:

[1] 您可以创建一个自定义操作方法，它具有与 query() 操作方法相同的属性，但带有一个额外的 transformResponse() 定义。 transformResponse() 方法在发出请求之后但在任何 promise 得到解决之前触发。它通过 JSON 字符串传递，您可以通过 angular.fromJson() 将其转换为常规 json 对象并遍历所有数组并使用新的可枚举属性扩充每个项目对象，我们称之为 ._length 然后返回新的反序列化对象以接收 promise 。这样，shallowClearAndCopy() 方法复制可枚举的 _length 属性并将其扩充到资源对象。

代码看起来像这样:

DEMO

  var DataResource = $resource('data.json', null, {
    'getData': {
      method: 'GET',
      isArray: true,
      transformResponse: function(response) {
        var newData = JSON.parse(response);

        newData.map(function(data) {
          data._length = data.length;
          return data;
        });

        return newData;
      }
    }
  });

  DataResource.getData(function(data) {
    console.log(data);
  });

您应该注意到，在 console.log() 中，它显示每个资源对象项都有一个您可以使用的 _length 属性。

[2] 另一种方法是针对此特定用例使用 $http 服务，这是我能想到的针对此问题的最简单解决方案。

$http.get('data.json').success(function(data) {
  console.log(data);
});

[3] 重新考虑您的响应数据的结构，如下所示:

[{
  item: [1,2,3,4,5]
}, {
  item: [1,2,3,4,5]
}, {
  item: [1,2,3,4,5]
}, {
  item: [1,2,3,4,5]
}];

然后您可以简单地使用 $resource 工厂并使用 item 键迭代到每个数组项对象。