我使用ngTable在AngularJs中创建了一个应用程序,我使用ngTable来显示用户数据,并且根据要求,我必须使用表中的单个列来按名字和名字进行过滤,这些名称在{{ 1}}我在表格单元格上连接结果。但我不能通过连接过滤。
我已经尝试创建一个自定义过滤器,如http://bazalt-cms.com/ng-table/example/11上所述,以完成此任务,但到目前为止还未成功。
我可以通过循环遍历数组来修改接收数据的范围,但结果集预计会非常大,我认为这不是正确的方法。
以下是一个简化示例。是否存在使用模型或过滤器按连接字符串过滤的“角度方式”?
$scope
var app = angular.module('app', ['ngTable']);
app.controller('IndexCtrl', function ($scope, $filter, ngTableParams) {
$scope.people = [{
"id": 1,
"firstName": "Chuck",
"lastName": "Norris",
}, {
"id": 2,
"firstName": "John",
"lastName": "Lennon",
}, {
"id": 3,
"firstName": "Bender",
"lastName": "Rodriguez",
}];
$scope.peopleCopy = $scope.people;
$scope.mytable = new ngTableParams({
page: 1, // show first page
count: 10, // count per page
sorting: {
name: 'desc'
}
}, {
getData: function ($defer, params) {
$scope.people = angular.copy($scope.peopleCopy);
var filteredData = $filter('filter')($scope.people, params.filter());
$scope.people = $filter('orderBy')(filteredData, params.orderBy());
$defer.resolve($scope.people);
}
});
});
答案 0 :(得分:1)
您可以创建一个查看两个字段的过滤器功能
$scope.people = [{
"id": 1,
"firstName": "Chuck",
"lastName": "Norris",
}, {
"id": 2,
"firstName": "John",
"lastName": "Lennon",
}, {
"id": 3,
"firstName": "Bender",
"lastName": "Rodriguez",
}];
$scope.filterLastAndFirst= function(person, searchParam){
return person.firstName.indexOf(searchParam) !== -1 || person.lastName.indexOf(searchParam) !== -1;
};
<li ng-repeat="item in products | filterLastAndFirst: searchParam">{{item.name}}</li>
// where $scope.searchParam is defined
或过滤器
app.filter('lastAndFirstFilter', function(){
return function(objectArray, searchParam){
var toReturn = [];
// parse the array and search for a parameter.
angular.forEach(objectArray, function(value){
if(value.lastName.indexOf(searchParam) !== -1 || value.firstName.indexOf(searchParam) !== -1)
toReturn.push(value);
});
return toReturn; // return the array
}
});
// used like this:
var filtered = $filter('lastAndFirstFilter')($scope.people, searchTerm);
答案 1 :(得分:0)
很明显,我使用一个简单的过滤器解决了过滤问题(如下所示)。它将值person.fullName
添加到表
$scope.getFullName = function(person) {
return person.fullName = person.name + ' ' + person.lastName;
}
并在ngTable的ng-repeat
中引用它<tr ng-repeat="person in $data | filter:getFullName">
然后在需要的地方使用{{person.fullName}}
对象的新添加值(在过滤器和单元格值中)。
<td data-title="'Name'" sortable="'person.fullName'"
filter="{ 'fullName': 'text' }" header-class="ngtable-header"
class="ngtable-td">{{ person.fullName }}</td>