AngularJS nhiều bộ lọc với chức năng bộ lọc tùy chỉnh

Tôi đang cố gắng lọc danh sách bằng nhiều bộ lọc + với chức năng bộ lọc tùy chỉnh.

Ví dụ jsfiddle hoạt động ban đầu là http://jsfiddle.net/ed9A2/1/ nhưng bây giờ tôi muốn thay đổi cách độ tuổi đang được lọc.

Tôi muốn thêm bộ lọc tùy chỉnh để độ tuổi nó lọc dựa trên hai giá trị đầu vào là min_age và max_age , (giữa độ tuổi).

Sau khi xem xét tài liệu. Tôi thấy mọi người có câu hỏi tương tự và người dùng Mark Rajcok trả lời http://docs.angularjs.org/api/ng.filter:filter#comment-648569667 có vẻ tốt và sẽ hoạt động. Nhưng tôi đang gặp sự cố khi áp dụng nó vào các mã của mình, điều này chủ yếu là do tôi có nhiều bộ lọc khác.

Tôi rất mới với AngularJS :(

Fiddle đã thử và KHÔNG hoạt động của tôi ở đây http://jsfiddle.net/ed9A2/20/

Bản sao dán mã KHÔNG hoạt động của tôi ở đây

Lượt xem

<div ng-app ng-controller="MainController">
<table class="fancyTable">
    <tr>
        <th>Player id</th>
        <th>Player name</th>
        <th>Age</th>
    </tr>
    <tr>
        <td><input ng-model="player_id" /></td>
        <td><input ng-model="player_name" /></td>
        <td>
            Min Age:<input ng-model="min_age" />
            Max Age:<input ng-model="max_age" />
        </td>
    </tr>
    <tr ng-repeat="player in players | filter:{id: player_id, name:player_name, age:ageFilter}">
        <td>{{player.id}}</td>
        <td>{{player.name}}</td>
        <td>{{player.age}}</td>
    </tr>
</table>

Bộ điều khiển

function MainController($scope) {

$scope.player_id = "";
$scope.player_name = "";
$scope.player_age = "";
$scope.min_age = 0;
$scope.max_age = 999999999;

$scope.ageFilter = function(player) {
    return ( player > $scope.min_age && player.age < $scope.max_age);
}

$scope.players = [
        {"name": "Rod Laver",
            "id": "rod",
            "date": "1938/8/9",
            "imageUrl": "img/rod-laver.gif",
            "age": 75},
        {"name": "Boris Becker", 
            "id": "borix",
            "date": "1967/11/22",
            "imageUrl": "img/boris-becker.gif",
            "age": 45},
        {"name": "John McEnroe",
            "id": "mcenroe",
            "date": "1959/2/16",
            "imageUrl": "img/john-mc-enroe.gif",
            "age": 54},
        {"name": "Rafa Nadal",
            "id": "nadal",
            "date": "1986/5/24",
            "imageUrl": "img/ndl.jpg",
            "age": 27}
    ]
}

Thử cái này:

<tr ng-repeat="player in players | filter:{id: player_id, name:player_name} | filter:ageFilter">

$scope.ageFilter = function (player) {
    return (player.age > $scope.min_age && player.age < $scope.max_age);
}

Hy vọng câu trả lời dưới đây trong liên kết này sẽ hữu ích, Bộ lọc Nhiều giá trị

Và hãy xem thử trò chơi với ví dụ

arrayOfObjectswithKeys | filterMultiple:{key1:['value1','value2','value3',...etc],key2:'value4',key3:[value5,value6,...etc]}

vĩ cầm

Trong tệp xem (HTML hoặc EJS)

<div ng-repeat="item in vm.itemList  | filter: myFilter > </div>

và Trong bộ điều khiển

$scope.myFilter = function(item) {
return (item.propertyA === 'value' || item.propertyA === 'value');
}