I'm currently facing an issue with sorting and filtering data in ngTables using an AJAX call. Although I have managed to display the data using ng-repeat, the sorting functions do not work as expected. After referencing this example http://plnkr.co/edit/zuzcma?p=info, I was able to make it function with a mock.js file. However, I am now working with a file hosted on my webserver, and I can't seem to get it to work.
I believe the solution is straightforward, and I would appreciate any assistance. Below, I have included my markup to provide insight into what my controller and HTML files look like. Thank you all for your help, and feel free to ask for more information if needed!
Below are some API links that I am referring to:
HTML:
<div ng-controller="myController">
<table ng-table="tableParams" show-filter="true" class="table table-condensed">
<tr ng-repeat="user in data">
<td data-title="foo" sortable="foo">{{user.foo}}</td>
<td data-title="bar" sortable="bar">{{user.bar}}</td>
</tr>
</table>
</div>
Controller:
var app = angular.module('app', ['ngTable']);
app.controller('myController', function($scope, $http, $filter, ngTableParams) {
$http.get('http://jsondata.com/myjson.json')
.success(function(data, status) {
$scope.data = data;
});
$scope.tableParams = new ngTableParams({
page: 1, // show first page
count: 10, // count per page
sorting: {
foo: 'asc' // initial sorting
}
}, {
total: data.length, // length of data
getData: function($defer, params) {
var orderedData = params.sorting() ?
$filter('orderBy')(data, params.orderBy()) :
data;
$defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
}
});
});