0
Ich versuche, Filter auf meine Datentabelle anzuwenden.Filtern Sie verkettete Daten in einer Datentabelle
<div class="widget-content table-container" ng-controller="getEmployeesController" style="overflow:auto">
<table ng-table="employeesList" show-filter="true" class="table table-striped table-bordered">
<tr ng-repeat="employee in $data">
<td data-title="'#'">
{{ (itemsPerPage * (pageNumber-1)) + $index+1 }}
</td>
<td data-title="'Name'" sortable="'Name'" filter="{ 'firstName+lastName': 'text' }">
{{employee.firstName +""+employee.lastName}}
</td>
<td data-title="'First Name'" sortable="'firstName'" filter="{ 'firstName': 'text' }">
{{employee.firstName}}
</td>
<td data-title="'Last Name'" sortable="'lastName'" filter="{ 'lastName': 'text' }">
{{employee.lastName}}
</td>
</tr>
</table>
</div>
Die Filterung funktioniert gut in 2. und 3.. Ich möchte ein TD, wo der Vorname und der zweite Name verkettet sind.
App.js
//Datatable
myApp.factory('dataTable', ['$filter', 'ngTableParams', '$rootScope', function ($filter, ngTableParams, $rootScope) {
var factoryDefinition = {
render: function($scope, config, componentId, data) {
if (!config) config = { filter: { 'firstName': $rootScope.mysearch } };
var config = angular.extend({}, {page:1, count:10}, config)
$scope[componentId] = new ngTableParams(config, {
total: data.length, // length of data
getData: function ($defer, params) {
// organize filter as $filter understand it (graph object)
var filters = {};
var val = $rootScope.mysearch;
var key = "firstname";
$rootScope.mysearch = "";
angular.forEach(params.filter(), function (val, key) {
var filter = filters;
var parts = key.split('.');
for (var i = 0; i < parts.length; i++) {
if (i != parts.length - 1) {
filter[parts[i]] = {};
filter = filter[parts[i]];
}
else {
filter[parts[i]] = val;
}
}
});
// use build-in angular filter
var filteredData = params.filter() ?
$filter('filter')(data, filters) :
data;
var orderedData = params.sorting() ?
$filter('orderBy')(filteredData, params.orderBy()) :
data;
params.total(orderedData.length); // set total for recalc pagination
$defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
$scope.pageNumber = params.page();
$scope.itemsPerPage = params.count();
}
});
}
}
return factoryDefinition;
}
]);
myApp.filter('customFilter', ['$filter', function ($filter) {
var filterFilter = $filter('filter');
var standardComparator = function standardComparator(obj, text) {
text = ('' + text).toLowerCase();
return ('' + obj).toLowerCase().indexOf(text) > -1;
};
return function customFilter(array, expression) {
function customComparator(actual, expected) {
var isBeforeActivated = expected.before;
var isAfterActivated = expected.after;
var isLower = expected.lower;
var isHigher = expected.higher;
var higherLimit;
var lowerLimit;
var itemDate;
var queryDate;
if (ng.isObject(expected)) {
//exact match
if (expected.distinct) {
if (!actual || actual.toLowerCase() !== expected.distinct.toLowerCase()) {
return false;
}
return true;
}
//matchAny
if (expected.matchAny) {
if (expected.matchAny.all) {
return true;
}
if (!actual) {
return false;
}
for (var i = 0; i < expected.matchAny.items.length; i++) {
if (actual.toLowerCase() === expected.matchAny.items[i].toLowerCase()) {
return true;
}
}
return false;
}
//date range
if (expected.before || expected.after) {
try {
if (isBeforeActivated) {
higherLimit = expected.before;
itemDate = new Date(actual);
queryDate = new Date(higherLimit);
if (itemDate > queryDate) {
return false;
}
}
if (isAfterActivated) {
lowerLimit = expected.after;
itemDate = new Date(actual);
queryDate = new Date(lowerLimit);
if (itemDate < queryDate) {
return false;
}
}
return true;
} catch (e) {
return false;
}
} else if (isLower || isHigher) {
//number range
if (isLower) {
higherLimit = expected.lower;
if (actual > higherLimit) {
return false;
}
}
if (isHigher) {
lowerLimit = expected.higher;
if (actual < lowerLimit) {
return false;
}
}
return true;
}
//etc
return true;
}
return standardComparator(actual, expected);
}
var output = filterFilter(array, expression, customComparator);
return output;
};
}]);
-Controller
myApp.controller('getEmployeesController', ['$scope', 'employeeServices', 'dataTable', '$window', '$timeout', '$filter', '$rootScope', 'ngDialog',
function ($scope, employeeServices, dataTable, $window, $timeout, $filter, $rootScope, ngDialog) {
employeeServices.getEmployees().then(function (result) {
$scope.data = result.data;
});
Die verkettete TD ist nicht richtig gefiltert zu werden. Was muss ich tun, um es funktionsfähig zu machen?