1

这是一个有点宽泛的问题，所以我会尽量简洁。

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

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

父级列表由一个 API 调用提供，该父级的子级列表由每个父级 (1+n) 的附加 API 调用提供，以及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，另外跟踪对象

第二个选项似乎是为importedandchildren属性分配一个函数，我假设每个摘要周期都会计算它：

<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，但直到现在我还没有发现我必须深入研究手表或摘要。我还没有在野外找到足够复杂的示例应用程序来进行很好的比较。

4

1 回答 1

0

据我了解，您可能需要在$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 示例。

我希望这对你有帮助。

于 2014-03-18T09:36:04.403 回答