Question

这是一个广泛的问题，所以我会尽力简洁。

在处理应用程序的导入过程时，我遇到了以下数据结构：

[
  {
    type: foreignParent,
    children: [
      {
        type: foreignChild
        imported: true|false
      },
      {
        type: foreignChild
        imported: true|false
      }
    ]
  }
]

父项列表由一个API调用提供，该父项的子项列表由每个父项的额外API调用（1 + n）提供，imported的值基于是否更改在localChildren对象中是否存在已导入平台的内容。 foreignParent，foreignChild和localChild是三个不同的对象，由三个不同的服务提供不同的结构。

接下来的问题是，使用此控制器操作中涉及的三个服务构建一个大型对象数组是否更好，并使用ng-repeat进行迭代：

<ul>
  <li ng-repeat="p in foreignParents">
    <ul>
      <li ng-repeat="c in p.children">
        {{c.imported ? 'Imported' : 'Not Imported'}}
      </li>
    </ul>
  </li>
</ul>

在这种情况下，如果localChildren服务中的对象列表发生更改，我还必须设置观察者，遍历哈希值并重新计算导入的值，另外还要跟踪对象

第二种选择似乎是为imported和children属性分配一个函数，我假设它将在每个摘要周期计算：

<ul>
  <li ng-repeat="p in foreignParents">
    <ul>
      <li ng-repeat="c in p.children()">
        {{c.imported() ? 'Imported' : 'Not Imported'}}
      </li>
    </ul>
  </li>
</ul>

相当简单的第三个选项是拥有一个没有函数属性的本机对象，并将这些函数放在控制器上：

<ul>
  <li ng-repeat="p in foreignParents">
    <ul>
      <li ng-repeat="getChildren(p)">
        {{isImported(c) ? 'Imported' : 'Not Imported'}}
      </li>
    </ul>
  </li>
</ul>

目前，控制器或多或少看起来像这样：

app.controller('ImportCtrl', function ($scope, foreignParent, foreignChild, localChild) {

  $scope.foreignParents = [];

  $scope.githubRepositoryImported = function(repo) {
    localChild.RefNameExists(repo.ref_name);
  };

  foreignParent.Get().then(function(collection){
    _.each(collection.data, function(elem, i, list){
      foreignChild.Get(elem.login).then(function(collection){
        $scope.foreignParents[i].children = collection.data;
      });
    });
    $scope.foreignParents = collection.data;
  })

}]);

遗憾的是，这不符合我的预期，但那是因为我身边存在数据问题。我和一些朋友谈过这个问题，没有人知道广泛接受的正确方式是什么，所以我提议将其发布到StackOverflow以获得第二意见。

我只是不确定这些复杂的嵌套列表的正确方法是什么，由多个服务组成，或者如何查看列表被消化的次数，以及如何更改函数结果可能会被传播。 我确信在某些情况下我可能需要一个明确的$scope.$watch或甚至可能强制$scope.$digest，但直到现在我还没有发现我不得不深入研究手表或摘要。我没有在野外找到一个足够复杂的示例应用程序来进行比较。

Answer 1

根据我的理解，你可能需要在通过集合数组循环并返回单数项目的承诺时使用$q.all()。

尝试这样的事情

getCollection().then(function(collection){
  var arr =[];
  angular.forEach(collection,function (item){
    arr.push(getSingular(item.id));
  });
  return $q.all(arr);
}).then(function(t){
  // note this response will be an array of the returned promises.
  $scope.foreignParents = t;
});

我冒昧地为你创建Plunker example。

我希望这会对你有所帮助。

Angular.js深层对象分辨率

1 个答案: