You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository has been archived by the owner on Feb 18, 2024. It is now read-only.
Note:
Taken exactly from fix by Luis Serrano
Raised and fixed by -Luis Serrano - https://github.com/luisnomad
Issue details - #415
Issue:
I can show data, and the pagination shows up. When I click on the different pages, the "page" value changes and a request is made to the server with the correct arguments, getting back valid data from the server. However, after the first page, all pages show up empty. I don't see any errors so I have no clue about what the issue is. I haven't found any complete example including a controller and a service that requests data from an external API so I don't have a model to follow.
var controller = this;
$scope.selected = [];
$scope.query = {
order: 'title',
limit: 10,
page: 1,
filter: ''
};
controller.success = function(data) {
console.log ('Success!');
controller.series = data;
}
controller.onPaginate = function (page, limit) {
console.log ('paginate!'); // this is fired when I click the pages
marvelService.onPaginate(page, limit, controller.success);
}
marvelService.getSeries($scope.query, controller.success);
}]);`
Service to replicate:
`app.factory('marvelService', ['$resource', function($resource) {
var apiKey = '183a5cde76132c19a818d4874fb43ada';
var vm = this;
vm.onPaginate = onPaginate;
vm.checked = false;
vm.results = [];
vm.progress = undefined;
vm.filterVisibility = false;
vm.filters = {
search: '',
limit: '10',
order: '',
page: 1
};
var series = $resource('http://gateway.marvel.com:80/v1/public/series');
var getSeries = function (filters, cb) {
var params = filters || vm.filters;
var offset = (params.page - 1) * params.limit + 1
return series.get({
limit: params.limit,
offset: offset,
apikey: apiKey
}, cb).$promise;
}
var onPaginate = function (page, limit, cb) {
return getSeries(angular.extend({}, vm.filters, {
page: page,
limit: limit
}), cb);
}
return {
getSeries: getSeries,
onPaginate: onPaginate
};
}]);`
Fix:
The issue was in the ng-repeat directive: | limitTo: query.limit: (query.page - 1) * query.limit
I removed that and now it works!
What doesn't work for pagination with server side binding: ng-repeat="show in marvel.series.data.results | orderBy: query.order | limitTo: query.limit : (query.page -1) * query.limit" What works for pagination with server side binding: ng-repeat="show in marvel.series.data.results | orderBy: query.order"
Hope it helps!
The text was updated successfully, but these errors were encountered:
The issue was in the ng-repeat directive:
| limitTo: query.limit: (query.page - 1) * query.limit
I removed that and now it works!
What doesn't work for pagination with server side binding:
ng-repeat="show in marvel.series.data.results | orderBy: query.order | limitTo: query.limit : (query.page -1) * query.limit"
What works for pagination with server side binding:
ng-repeat="show in marvel.series.data.results | orderBy: query.order"
Hope it helps!
Note:
Taken exactly from fix by Luis Serrano
Raised and fixed by -Luis Serrano - https://github.com/luisnomad
Issue details - #415
Issue:
I can show data, and the pagination shows up. When I click on the different pages, the "page" value changes and a request is made to the server with the correct arguments, getting back valid data from the server. However, after the first page, all pages show up empty. I don't see any errors so I have no clue about what the issue is. I haven't found any complete example including a controller and a service that requests data from an external API so I don't have a model to follow.
HTML Code to replicate:
`
Controller to replicate:
`app.controller('marvelController', ['marvelService', '$scope', function(marvelService, $scope) {
'use strict';
}]);`
Service to replicate:
`app.factory('marvelService', ['$resource', function($resource) {
}]);`
Fix:
The issue was in the ng-repeat directive:
| limitTo: query.limit: (query.page - 1) * query.limit
I removed that and now it works!
What doesn't work for pagination with server side binding:
ng-repeat="show in marvel.series.data.results | orderBy: query.order | limitTo: query.limit : (query.page -1) * query.limit"
What works for pagination with server side binding:
ng-repeat="show in marvel.series.data.results | orderBy: query.order"
Hope it helps!
The text was updated successfully, but these errors were encountered: