AngularJs ng-repeat 有条件地按限制过滤

Question

我怎样才能运行ng-repeat 最多2 次，但每次迭代都应该满足condition 并输出带有两个元素的最终数据。例如，我有一个像这样的数组：

$scope.users = [
    {
        id: '1',
        name:'Ali',
        status: true
    },
    {
        id: '2',
        name:'Wajahat',
        status: false
    },
    {
        id: '3',
        name:'Hammad',
        status: true
    },
    {
        id: '4',
        name:'Ahmad',
        status: true
    }
];

HTML 是这样的：

<div ng-repeat="user in users | limitTo:2" ng-if="user.status==true">{{user.name}}</div>

问题是，我只得到 1 个元素作为输出，即 Ali 而不是 Ali 和 Hammad。因为ng-repeat 在第二次迭代后停止并且没有检查其他元素。那么，如何在给定限制的情况下通过 status==true 获取所有匹配元素？

Answer 1

您可以将filter 链接到您的ng-repeat 表达式，以在limitTo 启动之前应用您需要的条件过滤。

请注意，在这种方法中，表达式的顺序很重要。

angular
  .module('app', [])
  .controller('ctrl', function ($scope) {
    $scope.users = [
      {
        id: '1',
        name:'Ali',
        status: true,
      },
      {
        id: '2',
        name:'Wajahat',
        status: false,
      },
      {
        id: '3',
        name:'Hammad',
        status: true,
      },
      {
        id: '4',
        name:'Ahmad',
        status: true,
      }
    ];
    
  });

<div ng-app="app" ng-controller="ctrl">
  <div ng-repeat="user in users | filter:{status: true} | limitTo:2">{{ user.name }}</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>