AngularJS-Mehrfachfilter mit benutzerdefinierter Filterfunktion

Ich versuche, die Liste mit mehreren Filtern + mit einer benutzerdefinierten Filterfunktion zu filtern.

Das ursprüngliche funktionierende jsfiddle-Beispiel ist http://jsfiddle.net/ed9A2/1/ aber jetzt möchte ich die Art und Weise ändern, wie das Alter gefiltert wird.

Ich möchte einen benutzerdefinierten Filter hinzufügen, damit das Alter basierend auf zwei Eingabewerten, min_age und max_age, filtert ) (zwischen dem Alter) wird.

Nach dem Blick in doc. Ich fand Leute mit ähnlichen Fragen und ein Benutzer Mark Rajcok Antwort http://docs.angularjs.org/api/ng.filter:filter#comment-648569667 sieht gut aus und sollte funktionieren. Aber ich habe Probleme, es in meine Codes anzuwenden, was hauptsächlich darauf zurückzuführen ist, dass ich andere Mehrfachfilter habe.

Ich bin sehr neu bei AngularJS :(

Meine bewährte und NICHT funktionierende Geige ist hier http://jsfiddle.net/ed9A2/20/

Eine Kopie meiner NICHT funktionierenden Codes finden Sie hier

Aussicht

<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>

Regler

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}
    ]
}

Versuche dies:

<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);
}

Hoffe, die unten stehende Antwort in diesem Link hilft, Mehrfachwertfilter

Und werfen Sie einen Blick in die Geige mit Beispiel

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

Geige

In der Ansichtsdatei (HTML oder EJS)

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

und In Controller

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