我正在研究codepen。数据来自一系列对象,我只需要通过名称和数量来制作过滤器。
我有此代码,但如果您在搜索框中输入字符,则只能按金额进行搜索,而不能按名称进行搜索。换句话说,如果您键入“ warren ”或“ 37.47 ”,则必须返回相同的结果,但不起作用。
var filterFilter = $filter('filter');
$scope.filter = {
condition: ""
};
$scope.$watch('filter.condition',function(condition){
$scope.filteredlist = filterFilter($scope.expenses,{name:condition} && {amount:condition});
$scope.setPage();
});
答案 0 :(得分:1)
您想为自己的应用创建自定义过滤器。
directiveApp.filter("myFilter", function () {
return function (input, searchText) {
var filteredList = [];
angular.forEach(input, function (val) {
// Match exact name
if (val.name == searchText) {
filteredList.push(val);
}
// Match exact amount
else if (val.amount == searchText) {
filteredList.push(val);
}
});
input = filteredList;
return input;
};
});
您可以在此过滤器中编写逻辑,现在使用此过滤器过滤列表。
<强>更新强>
您只需将此过滤器实施到自定义过滤器pagination
。
以下是您的代码的新版本。 Codepen
您的代码更新列表
为ng-repeat属性添加了新的过滤器参数
ng-repeat =&#34;过滤列表中的费用|分页:pagination.currentPage:numPerPage:filter.condition&#34;
......
答案 1 :(得分:1)
好吧,最后(基于idea的Abhilash P A并阅读docs),我以这种方式解决了我的问题:
var filterFilter = $filter('filter');
$scope.filter = {
condition: ""
};
$scope.$watch('filter.condition',function(condition){
$scope.filteredlist = filterFilter($scope.expenses,function(value, index, array){
if (value.name.toLowerCase().indexOf(condition.toLowerCase()) >= 0 ) {
return array;
}
else if (value.amount.indexOf(condition) >= 0 ) {
return array;
}
});
$scope.setPage();
});
最终codepen! (要命)