问题
I'm currently working on a table that requires some sorting. Since the project is using Angular (v1.2.12) I started using the ngTable module (v0.3.2).
The default sorting is the title but the year can also be used as sorting option. When I load the page it works fine, but when I click a table heading the clicked column gets sorted but the sorting is not reflected in the header, also the sorting param is no longer set.
When I start debugging I see that the params.sorting() returns: {title: undefined} From that moment it also is no longer possible to click on a sortable header, it just doesn't do anything anymore.
I think I'm missing something, can't seem to find what though
My data is as follows:
[{
"year": 2014,
"title": "Golden title"
}, {
"year": 2013,
"title": "Golden title"
}, {
"year": 2013,
"title": "Another title"
}, {
"year": 2014,
"title": "Whetshoverwerd xsade aas"
}, {
"year": 2013,
"title": "Another brilliant title"
}, {
"year": 2013,
"title": "Wherever I may SOAP"
}]
The view:
<table ng-table="tableParams" class="table">
<tbody>
<tr ng-repeat="document in $data">
<td data-title="'Year'" sortable="'year'">{{document.year}}</td>
<td data-title="'Title'" sortable="'title'"><a href="#">{{document.title}}</a></td>
</tr>
</tbody>
</table>
The view is a directive,
angular.module('appDirectives').directive('myModuleDirective', function () {
// Runs during compile
return {
restrict: 'E',
templateUrl: 'path/to/view.html',
replace: true,
controller: function ($scope, $timeout, $filter, TitleList, ngTableParams) {
$scope.tableParams = new ngTableParams({
page: 1, // show first page
count: 10, // count per page
sorting: {
title: 'asc' // initial sorting
}
}, {
total: 0, // length of data
getData: function ($defer, params) {
TitleList.get({}, function (data) {
var orderedData = params.sorting() ?
$filter('orderBy')(data, params.orderBy()) :
data;
params.total(orderedData.length);
orderedData = orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count());
$defer.resolve(orderedData);
});
}
});
}
};
回答1:
The issue is not yet clear to me however, the examples at ngTable use v0.3.1 and I use v0.3.2. The issue was solved by starting to use the older version.
回答2:
I've had this issue too, there might be some bugs in v0.3.2
I fixed this one by replacing line 502 in the ng-table code with this line:
var sortingParams = (event && (event.ctrlKey || event.metaKey)) ? $scope.params.sorting() : {};
I'm not sure this is the right fix (not sure why 'event' was undefined) but it fixed the problem for me. So please don't take this as a proper solution, it's just my 2 pence.
回答3:
I've had this issue, it was a response format issue.
The issue was because, I was returning an object instead of an array, ex:
Bad format:
{
"data": {
"items": {
"0": {
"post_id": "26",
"post_date": "2015-06-24 00:00:00"
Good Format:
{
"data": {
"items": [
{
"id": "26",
"create_date": "2015-02-19 14:15:44",
The table works with an object as well, but NOT all of the functions.
来源:https://stackoverflow.com/questions/22047342/sorting-ngtable-doesnt-work-when-heading-gets-clicked