亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

具有自定義過濾功能的AngularJS多重過濾器

具有自定義過濾功能的AngularJS多重過濾器

Smart貓小萌 2019-10-17 16:01:29
我正在嘗試使用多個過濾器+自定義過濾器功能過濾列表。最初工作的jsfiddle示例是http://jsfiddle.net/ed9A2/1/,但是現在我想更改年齡過濾的方式。我想添加一個自定義過濾器,以使其年齡基于兩個輸入值min_age和max_age(在年齡之間)進行過濾。在研究文檔之后。我發現有人有類似的問題,用戶Mark Rajcok回答了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}    ]}
查看完整描述

3 回答

?
幕布斯7119047

TA貢獻1794條經驗 獲得超8個贊

嘗試這個:


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

}


查看完整回答
反對 回復 2019-10-17
?
神不在的星期二

TA貢獻1963條經驗 獲得超6個贊

希望下面這個鏈接的答案會有所幫助, 多值過濾器


并以示例來研究小提琴


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


查看完整回答
反對 回復 2019-10-17
?
米脂

TA貢獻1836條經驗 獲得超3個贊

檢視檔案(HTML或EJS)


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

和在控制器


$scope.myFilter = function(item) {

return (item.propertyA === 'value' || item.propertyA === 'value');

}


查看完整回答
反對 回復 2019-10-17
  • 3 回答
  • 0 關注
  • 800 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號