Reputation: 1
i'm trying to show a list with pagination in angularjs, but only show first page and the others are empty. Can you help me?
This is my code:
Controller.js:
angular.module('Client').controller('ListaInventarioCtrl', function($scope, $location, $filter, InventarioResource){
$scope.Inventarios = InventarioResource.query();
$scope.pageSize = 5;
$scope.currentPage = 0;
$scope.getData = function () {
return $filter('filter')($scope.Inventarios, $scope.search)
}
$scope.numberOfPages=function(){
return Math.ceil($scope.getData().length/$scope.pageSize);
}
});
angular.module('Client')
.filter('startFrom', function() {
return function(input, start) {
start = +start;
return input.slice(start);
}
});
listInventario.html:
<div class="input-field">
<input placeholder="Search" type="text" ng-model="search">
</div>
<tr ng-repeat="Inventario in Inventarios | filter:search | limitTo:pageSize | startFrom:currentPage*pageSize">
<td>{{ Inventario.id }}</td>
</tr>
<button ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1">
Previous
</button>
{{currentPage+1}}/{{numberOfPages()}}
<button ng-disabled="currentPage >= getData().length/pageSize - 1" ng- click="currentPage=currentPage+1">
Next
</button>
When i click Next button, the list in ng-repeat is empty
Upvotes: 0
Views: 1166
Reputation: 190
I will complement the answers with: limitTo:pageSize track by $index"
<tr>
<td data-ng-repeat="Inventario in filteredData =
(Inventarios| filter:search)
| startFrom: currentPage * pageSize
| limitTo:pageSize track by $index">
<span>{{Inventario.id}}</span>
</td>
</tr>
Or in this answer that i found y the first option there ir a good example
Stackoverflow: enter link description here
Plunker: enter link description here
Get lucky :)
Upvotes: 0
Reputation: 1
I found the solution, you must first use "startFrom" and after "limitTo" in the ng-repeat.
This would be the solution:
<tr ng-repeat="Inventario in Inventarios | filter:search | startFrom:currentPage*pageSize | limitTo:pageSize">
<td>{{ Inventario.id }}</td>
</tr>
Upvotes: 0