Angularjs中如何使用filterFilter函数过滤
AngularJS的filter，中文名“过滤器”是用来过滤变量的值，或者格式化输出，得到自己所期望的结果或格式的东东。AngularJS中有一个filterFilter函数用来对集合过滤，非常方便。
源代码大致如下：
functionfilterFilter(){
returnfunction(aray,expressioncomparator){
if(!isArray(array))returnarray;
varcomparatorType=typeof(comparator),
predicates=[],
evaluatedObjects=[];
predicates.check=function(value){
for(varj=0;j<predicates.length;jii){
if(!predicates[j](value){
returnfalse;
})
}
returntrue;
}
if(comparatorType!='function'{
if(comparatorType==='boolean'&&comparator){
comparator=function(obj,text){
returnangular.equals(obj,text);
}
}else{
comparator=function(obj,text){
...
}
}
})
}
}
controller部分如下：
angular
.module('app')
.controller('MainCtrl',['$scope',
function($scope){
$scope.users=$scope.users=[
{name:'',email:'',joined:2015-1-1}
];
$scope.filter={
fuzzy:'',
name:''
};
...
}]);
搜索所有任意字段
<inputtype="text"ng-model="filter.any">
<trng-repeat="userinusers|filter:filter.any">
<td>{{user.name}}</td>
<td>{{user.email}}</td>
<td>{{user.joined|date}}</td>
</tr>
搜索某个字段
<inputtype="text"ng-model="filter.name">
<trng-repeat="userinusers
|filter:filter.any
|filter:{name:filter.name}">
<td>{{user.name}}</td>
<td>{{user.email}}</td>
<td>{{user.joined|date}}</td>
</tr>
如果想name字段完全匹配：
<trng-repeat="userinusers
|filter:filter.any
|filter:{name:filter.name}：true">
<td>{{user.name}}</td>
<td>{{user.email}}</td>
<td>{{user.joined|date}}</td>
</tr>
搜索时间段
contrlller部分修改为：
angular
.module('app')
.controller('MainCtrl',['$scope',
function($scope){
$scope.users=$scope.users=[
{name:'',email:'',joined:2015-1-1}
];
$scope.filter={
fuzzy:'',
name:''
};
$scope.minDate=newDate('January1,2000');
$scope.maxDate=newDate();
$scope.min=function(actual,expected){
returnactual>=expected;
};
$scope.max=function(actual,expected){
returnactual<=expected;
};
}]);
页面部分为：
<inputtype="text"ng-model="fromDate"data-min-date="{{minDate}}">
<inputtype="text"ng-model="untilDate"data-max-date="{{maxDate}}">
<trng-repeat="userinusers
|filter:filter.any
|filter:{name:filter.name}
|filter:{joined:untilDate}:max
|filter:{joined:beforeDate}:min">
<td>{{user.name}}</td>
<td>{{user.email}}</td>
<td>{{user.joined|date}}</td>
</tr>
以上所述是小编给大家分享的Angularjs中如何使用filterFilter函数过滤的相关知识，希望对大家有所帮助。
热门推荐
10 八一幼儿祝福语大全简短
11 公司乔迁食堂祝福语简短
12 婚礼结束聚餐祝福语简短
13 儿媳买车妈妈祝福语简短
14 毕业送礼老师祝福语简短
15 同事辞职正常祝福语简短
16 恭贺新婚文案祝福语简短
17 金店立秋祝福语简短英文
18 婆婆高寿祝福语大全简短