Question

条件匹配时，我想计算ng-repeat的迭代次数。

我已经尝试过$index，但它会打印嵌套ng-repeat中所有迭代/项目

<tbody ng-controller="MainCtrl">
    <tr ng-repeat-start="a in test1">
          <td>{{a.categoryName}}(count_here)</td>
        </tr>
        <tr ng-repeat-end ng-repeat="b in test" ng-if="a.categoryId==b.categoryId">
          <td>{{b.name}}</td>
        </tr>
</tbody>

i want like this 
category_one(4)  <=item count 4 items in this category so 4 will display
    item1
    item2
    item3
    item4 
category_two(2)
    item5
    item6

<!-- this is in controller -->

$scope.test1=[{
        categoryId:'1',categoryName:'category one'
    },
    {
        categoryId:'2',categoryName:'category two'
    }]
    $scope.test = [
        {categoryId:'1',name:'cate 1 elem0'},
        {categoryId:'1',name:'cate 1 elem1'},
        {categoryId:'2',name:'cate 2 elem'}
    ];
});

Answer 1

一种选择是在控制器中创建一个进行计数的函数（getCount），如下所示：

$scope.getCount = function(categoryId) {        // returns the count by matching by categoryId
  return $scope.test.filter(function(element) { // first, filter elements in `test`
    return element.categoryId === categoryId;   // matching by categoryId
  }).length;                                    // then, return the count of how many results we got after the filter
}

在html调用中，该函数如下：

<tbody ng-controller="MainCtrl">
    <tr ng-repeat-start="a in test1">
      <td>{{a.categoryName }} ({{getCount(a.categoryId)}})</td> <!-- <-- call the function in order to display the count -->
    </tr>
    <tr ng-repeat-end ng-repeat="b in test" ng-if="a.categoryId == b.categoryId">
      <td>{{b.name}}</td>
    </tr>
</tbody>

在此处查看演示：https://jsfiddle.net/lealceldeiro/v9gj1ok4/11/

Answer 2

感谢您的帮助。但是我得到了预期的输出，而没有任何函数调用或过滤器

此处是小提琴链接：https://jsfiddle.net/wk3nzj96/

html代码：

<div ng-app='myapp' >
<div ng-controller="MainCtrl">
  <table ng-init="$scope.counter=0">

    <tr ng-repeat-start="cate in mainCategory">
     <td>   {{cate.name}} ({{$scope.counter[$index]}})</td></tr>

    <tr ng-repeat="itemsItr in items" ng-init="$scope.counter[$parent.$parent.$index]=$scope.counter[$parent.$parent.$index]+1" ng-if="itemsItr.mid==cate.id">
        <td>{{itemsItr.name}}</td>
    </tr>
    <tr ng-repeat-end ng-if="false"></tr>
  </table>

</div>
</div>

和ControllerCode：

(function() {
  angular.module('myapp', []).controller('MainCtrl', function($scope) {
     $scope.mainCategory = [
   { name: "categoryOne",id:1 },
   { name: "categoryTwo",id:2 }
    ];
     $scope.items = [
   { name: "item1FromCateOne" ,mid:1 },
   { name: "item2FromCateOne",mid:1 },
   { name: "item3FromCateOne" ,mid:1 },
   { name: "item1FromCateTwo",mid:2 }
    ];

  });

这是这种标准方式吗？

如何在没有$ index的情况下计算嵌套ng-repeat中的项目

2 个答案: