我可以使用对象方法来过滤ng-repeat吗？

Question

我一般都是角度和Javascript OOP的新手。我希望构建一个可重用的角度组件，其中所有控件都可以绑定到javascript对象的实例。我遇到的一个奇怪的行为是尝试使用javascript对象的方法过滤集合。

我有一个带有签名的方法filterVisible的对象：

this.filterVisible = function(item) 

当我尝试使用通过该对象方法方法过滤的ng-repeat时：

ng-repeat="item in item1.items | filter: item1.filterVisible"

它似乎不起作用，但如果我将该对象方法包装在我的$ scope中的方法中，如下所示：

$scope.filterVisible1 = function(item) {
  return ($scope.item1.filterVisible(item));
}

并将我的重复更改为：

ng-repeat="item in item1.items | filter: filterVisible1"

有效。

这有点令人困惑，所以我把它放进plunker。有人可以解释为什么使用范围方法的过滤器有效，但是使用对象方法的过滤器不能解决问题吗？

Answer 1

正如您在文档中看到的那样，http://docs.angularjs.org/api/ng.filter:filter

{{ filter_expression | filter:expression:comparator }}

您可以将表达式与filter一起使用，并且用于评估所有属性的表达式针对范围进行评估，而不像JavaScript那样根据全局窗口评估表达式作为文档中的deccirbe http://docs.angularjs.org/guide/expression。

因此，提出的问题是

item1.filterVisible是否在范围内定义？ vs. filterVisible1是否在范围内定义？

字符串“item1.filterVisible”可由Javascript评估，但它不适用于$ scope。$ eval（）方法。

要确保表达式正常工作，请在点击元素后在Chrome控制台中运行以下命令。

angular.element($0).scope().$eval(<your expression>)

另外，我相信对象应该有有意义的方法名称。在您的情况下，filterVisible有点令人困惑。

- 编辑 -
它转变为我们提供的代码都在$ scope中定义。我发现有JS错误，错误可以通过此修复。

  var _this = this;
  this.filterVisible = function(item) {
    return (Math.abs(_this.items.indexOf(item) - _this.selected_id) <= _this.limit);
  }