我想筛选具有多个过滤器+使用自定义过滤功能列表。
原来工作的jsfiddle例子是 jsfiddle/ed9A2/1/ ，但现在我想改变年龄的方式正在过滤器。
我要添加自定义过滤器，以便年龄其过滤器的基础上为 MIN_AGE 和 MAX_AGE ，（与年龄两个输入值）。
寻找到文档后。我发现人有类似的问题和用户马克Rajcok答案docs.angularjs/api/ng.filter:filter#comment-648569667看起来不错，应该工作。但我有申请到我的codeS，主要似乎是因为我有其他多个过滤器的问题。
林很新的AngularJS：（
我试过和不工作的小提琴是在这里 jsfiddle/ed9A2/20/
我不工作$ C $的复制粘贴CS在这里
查看
＆LT; DIV NG-NG应用程序控制器=MainController＆GT;＆LT;表类=fancyTable＆GT; ＆所述; TR＆GT; ＆LT;第i个玩家ID＆LT; /第i ＆LT;第i个球员的名字和LT; /第i ＆LT;第i年龄和LT; /第i ＆LT; / TR＆GT; ＆所述; TR＆GT; ＆LT; TD＆GT;＆LT;输入NG模型=player_id/＆GT;＆LT; / TD＆GT; ＆LT; TD＆GT;＆LT;输入NG模型=PLAYER_NAME/＆GT;＆LT; / TD＆GT; ＆所述; TD＆GT; 年龄下限：其中，输入NG模型=MIN_AGE/＆GT; 最大年龄：其中，输入NG模型=MAX_AGE/＆GT; ＆LT; / TD＆GT; ＆LT; / TR＆GT; ＆LT; TR NG重复=球员在球员|过滤器：{ID：player_id，名称：PLAYER_NAME，年龄：ageFilter}＆GT; ＆所述; TD＆GT; {{player.id}}＆下; / TD＆GT; ＆所述; TD＆GT; {{player.name}}＆下; / TD＆GT; ＆所述; TD＆GT; {{player.age}}＆下; / TD＆GT; ＆LT; / TR＆GT;＆LT; /表＆gt;
控制器
函数MainController（$范围）{$ scope.player_id =;$ scope.player_name =;$ scope.player_age =;$ scope.min_age = 0;$ scope.max_age = 999999999;$ scope.ageFilter =功能（播放器）{ 回报（播放器和GT; $ scope.min_age＆放大器;＆安培; player.age＆LT; $ scope.max_age）;}$ scope.players = [ {名：罗德·拉沃 ID：棒， 日期：1938年8月9日 图片网址：IMG /棒laver.gif， 时代：75}， {名：贝克尔 ID：borix 日期：1967年11月22日 图片网址：IMG /鲍里斯 - becker.gif 时代：45}， {名：约翰·麦肯罗 ID：麦肯罗 日期：1959年2月16日 图片网址：IMG /约翰-MC-enroe.gif 时代：54}， {名：纳达尔 ID：纳达尔 日期：1986年5月24日 图片网址：IMG / ndl.jpg， 时代：27} ]}解决方案
试试这个：
＆LT; TR NG重复=球员在球员|过滤器：{ID：player_id，名称：PLAYER_NAME} |过滤器：ageFilter＆GT;$ scope.ageFilter =功能（播放器）{ 回报（player.age＆GT; $ scope.min_age＆放大器;＆安培; player.age＆LT; $ scope.max_age）;}I am trying to filter the list with multiple filters + with a custom filter function.
The original working jsfiddle example is jsfiddle/ed9A2/1/ but now I want to change the way age are being filter.
I want to add a custom filter so that age it filter based on two input value which is min_age and max_age , (between age) .
After looking into doc. I found people having similar questions and a user Mark Rajcok answer docs.angularjs/api/ng.filter:filter#comment-648569667 looks good and should be working. But I am having problem applying it into my codes which mainly seems to because I have other multiple filters.
Im very new to AngularJS :(
My tried and NOT working fiddle is here jsfiddle/ed9A2/20/
A copy paste of my NOT working codes are here
View
<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>Controller
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} ] }解决方案
Try this:
<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); }
更多推荐
AngularJS使用自定义过滤功能多个过滤
发布评论