कस्टम फ़िल्टर फ़ंक्शन के साथ AngularJS कई फ़िल्टर


95

मैं कस्टम फ़िल्टर फ़ंक्शन के साथ कई फ़िल्टर + के साथ सूची को फ़िल्टर करने का प्रयास कर रहा हूं।

मूल काम करने वाला jsfiddle उदाहरण http://jsfiddle.net/ed9A2/1/ है, लेकिन अब मैं चाहता हूं कि जिस तरह से फिल्टर किया जा रहा है, उसे बदलना चाहिए।

मैं एक कस्टम फ़िल्टर जोड़ना चाहता हूं ताकि यह आयु दो इनपुट मूल्य के आधार पर फ़िल्टर हो जो कि min_age और max_age , (उम्र के बीच) है।

डॉक्टर में देखने के बाद। मैंने पाया कि लोगों को इसी तरह के सवाल हैं और एक उपयोगकर्ता मार्क राजकोक का जवाब http://docs.angularjs.org/api/ng.filter:filter#comment-648569667 अच्छा लग रहा है और इसे काम करना चाहिए। लेकिन मुझे इसे अपने कोड में लागू करने में समस्या हो रही है जो मुख्य रूप से ऐसा लगता है क्योंकि मेरे पास अन्य कई फ़िल्टर हैं।

AngularJS के लिए बहुत नया :(

मेरी कोशिश की और काम नहीं कर पा रहा है यहाँ पर है http://jsfiddle.net/ed9A2/20/

मेरे काम नहीं कर रहे कोड की एक कॉपी पेस्ट यहाँ हैं

राय

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

नियंत्रक

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

जवाबों:


197

इसे इस्तेमाल करे:

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

7

इस लिंक में आशा से नीचे के जवाब से मल्टीपल वैल्यू फिल्टर में मदद मिलेगी

और उदाहरण के साथ बेला में एक नज़र डालें

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

बेला


यह सभी परिणाम लौटाता है यदि यह सूची में खोजा गया गुण नहीं पाता है, तो मैं इस व्यवहार को उलटने के लिए कैसे कर सकता हूं और यदि मूल्य सूची में मौजूद नहीं है तो कोई परिणाम नहीं लौटाएगा?
ज़कारिया बेलघी

0

दृश्य फ़ाइल (HTML या EJS) में

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

(नियंत्रक में

$scope.myFilter = function(item) {
return (item.propertyA === 'value' || item.propertyA === 'value');
}
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.