0

我的控制器上有一个数组

$scope.arr = [......], a

nd 在 html 中我想做

ng-repeat = "item in arr | color:'blue'" //this line works, filter done in the app.filter way.

其中颜色是 arr 中所有对象的属性。

如何使这种颜色:'blue' 可自定义和子颜色:'red'?

另外,如果我想做控制器过滤而不是 html,语法是什么,现在我有

$scope.filteredArr = $filter('color')($scope.arr,'blue'); 

这是给出错误

http://jsfiddle.net/x3azn/YpMKX/

张贴小提琴,请删除-1

4

1 回答 1

2

您可以color:'blue'使用 format 中的任何表达式进行自定义,因此只要定义了过滤器并存在于当前范围内,类似的filter:expression东西color:myColor就可以正常工作。colormyColor

在您的控制器中,您可以执行相同的操作。

$scope.filteredArr = $filter('color')($scope.arr,myColor);

这是一个基于您的 jsFiddle 示例的示例。

Javascript:

angular.module('app', [])
    .filter('eyecolor', function () {
        return function ( people, color ) {
            var arr = [];
            for ( var i = people.length; i--; ) {
                if ( people[i].eyeColor === color ) {
                    arr.push( people[i] );
                }
            }
            return arr;
        }
    })
    .controller('ctrl', function ($scope, $filter) {
        $scope.desiredColor = 'Brown';
        $scope.people = [
            {       
                name: 'Bob',
                eyeColor: 'Brown'
            }, {
                name: 'Katherine',
                eyeColor: 'Yellow'
            }, {
                name: 'Chun',
                eyeColor: 'Black'
            }
        ];
        $scope.peopleFilter = $filter('eyecolor')( $scope.people, $scope.desiredColor );
    });

html:

<div ng-app="app">
    <div ng-controller="ctrl">Color Desired:
        <input ng-model="desiredColor" /><br/>        
        <div ng-repeat="person in people | eyecolor: desiredColor">
            HTML filter: {{person.name}} has eye color {{person.eyeColor}}</div>
        <div ng-repeat="person in peopleFilter">
            Controller filter: {{ person.name }} has eye color {{ person.eyeColor }}</div>
    </div>
</div>
于 2013-04-29T13:27:15.250 回答