Question

我想在Angular中使用ng-repeat，而我只想输出数组的一些元素。一个例子：

ng-repeat="item in items | filter:($index%3 == 0)"

然而，这不起作用。请告诉我怎么做;只输出元素的精确索引。

Answer 1

在你的代码中，过滤器应用于'items'数组，而不是应用于每个数组项，这就是为什么它不能按预期工作。

相反，您可以使用ng-show（或ng-if）：

<ul>
    <li ng-repeat="item in items" ng-show="$index % 3 == 0">{{item}}</li>
</ul>

请参阅：http://jsfiddle.net/H7d26

编辑：如果您不想添加不可见的dom元素，请使用ng-if指令：

<ul>
    <li ng-repeat="item in items" ng-if="$index % 3 == 0">{{item}}</li>
</ul>

Answer 2

创建自定义filter，例如：

filter('modulo', function(){
  return function (arr, div, val) {
      return arr.filter(function(item, index){
          return index % div === (val || 0);
      })
  };
});

然后将ng-repeat更改为：

<ul ng-repeat="item in items | modulo:3">

或按(index % 3 === 1)过滤，如：

<ul ng-repeat="item in items | modulo:3:1">

http://jsfiddle.net/Tc34P/2/

Answer 3

您需要做的是在$ scope.items中找到“item”的索引。见下文

ng-repeat"item in items | filter:(items.indexOf(item)%3 == 0)

所以一个真实的例子（对于遇到这个解决方案的其他人）将是。

<div ng-repeat="item in filtered = (items | filter:customfilter | orderBy:customsort)">
    <div> This is number {{items.indexOf(item)}} in the items list on the scope.</div>
</div>

无论排序或过滤如何，上面的示例都将获得正确的位置

Answer 4

所有先例的答案都有效，但是如果你想使用过滤器，你也可以自己定义，就像这个小提琴一样：http://jsfiddle.net/DotDotDot/58y7u/

.filter('myFilter', function(){
    return function(data, parameter){
        var filtered=[];
        for(var i=0;i<data.length;i++){
                if(i%parameter==0)
                    filtered.push(data[i]);
        }
        return filtered;
    }
});

然后像这样调用它：

ng-repeat='item in items | myFilter:3'

（如果您想快速将其更改为偶数，我在参数中添加了额外的复杂性）

玩得开心

++

Answer 5

我建议使用函数进行过滤：

ng-repeat"item in filterItems(items)"

在控制器上：

$scope.filterItems= function(items) {
    var result = {};
    angular.forEach(items, function(item) {
       // if item is something.. add to result
    });
    return result;
}

Answer 6

解决此问题的另一种方法是创建一个新的＆＃34;列表＆＃34; （{1}}中我不知道在这种情况下的正确用语。然后可以在范围

内引用这个新列表

ng-repeat

<ul class="example-animate-container"> <li class="animate-repeat" ng-repeat="friend in filteredFriends = ((friends | filter:q:strict) | orderBy:'age')" ng-if="$index % 2 == 0"> [{{$index + 1}}] {{filteredFriends[$index].name}} who is {{filteredFriends[$index].age}} years old. <span ng-if="$index+1 < filteredFriends.length">[{{$index + 2}}] {{filteredFriends[$index+1].name}} who is {{filteredFriends[$index+1].age}} years old.</span> </li> </ul>包裹后半部分的ng-if会阻止在前一个元素是列表的最后一个元素时显示基础文本。

如何使用ng-repeat与filter和$ index？

6 个答案: