Como fazer uma paginação sob demanda com AngularJS? Eu tenho 2 particularidades:
1 - Não pode ser usado o jQuery, apenas o Angular ou JavaScript puro.
2 - Eu tenho 2 métodos o prevPage
e nextPage
.
Abaixo exemplo dos métodos:
$scope.prevPage = function(page){
if($scope.currentPage-1 > 0){
$scope.changePage(page);
}
}
$scope.nextPage = function(page){
if($scope.currentPage+1 <= $scope.numberOfPages){
$scope.changePage(page);
}
}
Aqui, para ficar mais visível, tem o HTML:
<ul class="pagination">
<li class="glyphicon glyphicon-chevron-left" ng-click="prevPage(currentPage-1)" ng-class="{disabled: currentPage == 1}"></li>
<li ng-repeat="i in numberOfPagesArr track by $index" ng-class="{active: $index+1 == currentPage}" ng-click="changePage($index+1)">{{$index+1}}</li>
<li class="glyphicon glyphicon-chevron-right" ng-click="nextPage(currentPage+1)" ng-class="{disabled: currentPage == numberOfPages}"></li>
</ul>
Atualmente está funcionando, porém na página carrega somente 10 páginas de paginação, mas se aumentar o número com certeza irá quebrar.
Aqui tem um exemplo da paginação em questão de como quero fazer.