本文使用三种方式自定义一个数组过滤器。
数组list:
[ { name:'张三',age:20,city:'上海' },{ name:'李思',age:30,city:'北京' },{ name:'王五',age:25,city:'深圳' } ]
1.自定义过滤器方式一 (在controller方法内定义一个方法)
html:
js:<li ng-repeat=" item in list | filter : myFilter1">
var app=angular.module('myApp',[]); app.controller("myCtrl",function($scope,List){ $scope.list=List; //自定义过滤器 方式一 仅显示年龄小于30岁的人员 $scope.myFilter1=function(obj){ if(obj.age < 30){ return true; }return false; }; });
2.自定义过滤器方式二 (.filter方法)
html:
<li ng-repeat=" item in list | filterCity">js:
//自定义过滤器 方式二 不显示上海的人员 app.filter('filterCity',function(){ return function (obj){ var newObj=[]; angular.forEach(obj,function(o){ if(o.city != "上海"){ newObj.push(o); } }); return newObj; } });
3.自定义过滤器方式三
原文链接:https://www.f2er.com/angularjs/148730.html<li ng-repeat=" item in list | myfilterAge">js:angular.module('myApp',[],function($filterProvider,$provide,$controllerProvider){ //自定义过滤器 方式三 仅显示年龄大于等于25岁的人员 $filterProvider.register('myfilterAge',function(){ return function (obj){ var newObj=[]; angular.forEach(obj,function(o){ if(o.age >= 25){ newObj.push(o); } }); return newObj; } }); //定义服务 $provide.service('List',function(){ return [ { name:'张三',city:'深圳' } ] }); //定义控制器 $controllerProvider.register('myCtrl',List){ $scope.list=List; }); });