范围过滤器错误

Question

我有一个名为 items 的数组，我正在尝试 ng-repeat 一系列的项目，例如 0-4 或 5-11 等。所以我尝试创建自己的自定义过滤器，但它当前仅显示所有数组元素。有没有比较了解的可以看看。
html

<div ng-app='myApp' ng-controller="Main">
  <li ng-repeat="item in items | filter:range(0,2)">test {{item}}</li>
</div>

过滤器

var myApp = angular.module('myApp', []);
myApp.controller('Main', function($scope, $http) {
  $scope.items = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
  $scope.range = function(min, max, step) {
    return function(items) {
      var arr = $scope.items;
      step = step || 1;
      var input = [];
      for (var i = min; i <= max; i += step) {
        if (arr[i] != null) {
          input.push(arr[i]);
        }
      }
      return items = input;
    };
  };
});

结果

test 1
test 2
test 3
test 4
test 5
test 6
test 7
test 8
test 9
test 0

Answer 1

如果您在 angular 中创建过滤器函数，则此函数必须 return "true" 如果给定的项目应该是结果集的一部分，如果不是，则 "false" . 由于某种原因，您的函数 returns "items = input;" 在这种情况下没有任何意义，并且始终解析为 true-ish，这就是将显示所有项目的原因。你可以尝试的是

$scope.range = function(min, max) {
    return function(item) {
        var i = $scope.items.indexOf (item); 
        return (i >= min && i <= max);
    };
  };

请参阅 angular 过滤器的文档以了解此功能的用途

Answer 2

与其大惊小怪，不如使用一个简单的 ng-if 和 ng-repeat，如下所示

<li ng-repeat="item in items" ng-if="$index >= 2 && $index <=5">test {{item}}</li>

范围过滤器错误

Error with range filter

javascript

arrays

filter

angularjs

ng-repeat