将参数传递给控制器上定义的过滤函数

【问题标题】：passing parameters to filter function defined on a controller将参数传递给控制器上定义的过滤函数
【发布时间】：2014-06-06 03:47:58
【问题描述】：

假设我有一个（极其简化的）控制器，定义如下：

 app.controller('myController', ['$scope', function(scope){
     list=[1,2,3,4,5]
     scope.filterFunction = function(item, upperBound){
       if(item < upperBound){
         return(item);
       }
     }
 }]);

如何通过模板传递 upperBound 的值？

<div ng-repeat="item in list | filter:filterFunction">{{item}}</div>

我知道如果你滚动一个专用过滤器，你可以用filterName:arg1:arg2....参数化

有没有办法用这种方法实现类似的行为？或者，有什么方法可以让控制器函数访问范围？

【问题讨论】：

标签： javascript angularjs angularjs-controller angularjs-filter

【解决方案1】：

如果您不创建专用过滤器，则可以在范围内创建一个函数来返回过滤后的项目。如：

app.controller('myController', ['$scope', function(scope) {
    scope.list = [1,2,3,4,5];
    scope.upperBound = 3;

    scope.filterFunction = function(list, upperBound) {
        var rval = [];
        for(var i = 0, l = list.length; i < l; i++)
        {
            if(list[i] < upperBound)
            {
                rval.push(list[i])
            }
        }
        return rval;
    };

    // or 
    scope.filteredList = function() {
        var rval = [];
        for(var i = 0, l = scope.list.length; i < l; i++)
        {
            if(scope.list[i] < scope.upperBound)
            {
                rval.push(scope.list[i])
            }
        }
        return rval;
    };

}]);

然后绑定到那个函数：

<ul>
  <li ng-repeat="item in filterFunction(list,upperBound)">
    {{item}}
  </li>
</ul>

或

<ul>
  <li ng-repeat="item in filteredList()">
    {{item}}
  </li>
</ul>

Plunker

【讨论】：