如何动态计算 ng-repeat 重复了多少次？

Question

关于如何正确计算视图中重复的记录的快速问题？

视图如下：

<h4> Drafts </h4>
<ul class="nav nav-pills scrollable-nav">
  <li ng-repeat="solution in solutions | filter: {'username': username}: true | filter: {visible: false} "> 

    <a href="#" onclick="return false;">
      <h5 ng-click="editSolution(solution.$id)">{{solution.name}}</h5>
    </a>

  </li>                            
</ul>

我想知道这个答案重复了多少次？用户可以随时将 solution.visible 值更改为 true，因此我需要动态显示该数字。

我可以在作用域中使用变量来跟踪该数字，但我想知道是否有其他更好的方法来做到这一点？

Answer 1

您可以创建一个临时变量来保存过滤结果的值

<li ng-repeat="solution in filteredSolutions = (solutions | filter: {'username': username, visible: false}: true)">

然后{{filteredSolutions.length}}得到计数

您还可以按照@Claies 的建议，通过为过滤结果添加别名来使用替代方法，Angular 1.3+

支持

<li ng-repeat="solution in solutions | filter: {'username': username, visible: false}: true as filteredSolutions">

Answer 2

有时候在controller中过滤数据会更方便。你可以这样做：

<div ng-controller="ListCtrl as ctrl">
      <ul>
          <li ng-repeat="person in ctrl.people" ng-click="ctrl.hide(person)">
            {{person.name}}: {{person.phone}}
          </li>
      </ul>
      <div>
          Records count: {{ctrl.people.length}}
      </div>
</div>

和控制器：

app.controller('ListCtrl', ['$scope', '$filter', function ($scope, $filter) {
    var self = this;    
    this.hide = function(item) {
       item.visible = false;
       self.refresh();
    };    
    this.refresh = function() {
        self.people = $filter('filter')(people, {visible: true});
    };   
    this.refresh();
}]);

这样您就可以在控制器变量中获得过滤后的数据，并可以使用它来显示记录数。

这里是jsfiddle with demo。

如何动态计算 ng-repeat 重复了多少次？

How to dynamic count how many times ng-repeat repeated?

data-binding

angularjs

ng-repeat

angularjs-ng-repeat

angularjs-filter