Angular.js: 如何计算嵌套ng-repeat中元素的数量

Question

所以，我的情况是我正在循环遍历一组JSON对象的列表，其中包含一个列表作为属性。我有一个内部循环在该列表属性上重复执行。类似于以下内容：

Number of results: {{count}}

<div ng-repeat="jsonObject in outerList | someFilter" ng-show="innerList.length">
    <h1>{{jsonObject.Name}}</h1><br>
    <div ng-repeat="items in jsonObject.listAttr | someOtherFilter as innerList">
        {{items.data}}<br>
    </div>
    <br>
</div>

我面临的问题是如何找到一种方法来抓取内部循环的每次迭代中所有元素的聚合计数。因此，如果第一个jsonObject有2个与内部过滤器匹配的元素，而第二个jsonObject有3个与内部过滤器匹配的元素，则我们在整个循环之外显示5个计数（在上面的计数变量中或类似的地方）。

我已经尝试了许多方法来获取该计数，但都没有成功。其中一些解决方案的问题是，过滤器是用户可以随时更改的内容（例如通过搜索框），因此我不能仅在控制器中应用所有过滤器，并在页面加载时显示它们。一开始可能有5个对象，直到用户在搜索框中键入内容将数字降至2。

- Dominator_101

---

你可以通过使用每个列表的长度并将它们加在给定的别名上来完成这个操作。我曾经在其他类似的情况下使用过一些基本的指针，这里有一些参考：http://angular-tips.com/blog/2014/08/tip-accessing-filtered-array-outside-ng-repeat/ - user1934587390

Answer 1

我觉得你想要这个...

$scope 中的函数

$scope.moreOne = function(counter) {
  $scope[counter]++;
}

每个 jsonObject 中的元素都会被计算。

<div ng-repeat="jsonObject in outerList | someFilter" ng-show="innerList.length">
      <h1>{{jsonObject.Name}}</h1><br>
      <div ng-repeat="items in jsonObject.listAttr | someOtherFilter as innerList" ng-init="moreOne('count')">
          {{items.data}}<br>
      </div>
      <br>
  </div>

你看到ng-init了吗？

ng-init="moreOne('count')"

也许这个解决方案不是最好的...问候！:-)

更新

好的，你可以使用观察器来控制模型的变化。如果outerList或任何一个属性（你可以为任何属性定义一个观察器）发生变化，观察器将被触发。而且你只需要这段代码，不需要更多的函数 :-)

    $scope.$watch("outerList", function(list) {
      $scope.count = 0;
      for(var i = 0; i < list.length; i++) {
        $scope.count += list[i]['listAttr'].length;
      }
    });

- Toni Villena

---

我在其他地方看到过类似的解决方案，但那不会动态更新，对吧？如果列表最终通过筛选器/等方式进行更新，它将继续添加到计数中，并永远不会重置为0？ - Dominator_101

@Dominator_101，我已经更新了我的答案。希望能对你有所帮助 :-) - Toni Villena