In angular 1, how can I paginate my ng-repeats?

Question

I am currently limiting my ng-repeat to 5 using a filter, but I\'m wondering how I can paginate the data.

<         


        
      

Answer 1

How about Angular way of doing pagination?

You can just use the built in - lightweight Angular/Bootstrap pagination.

1. In your Javascript file:

   angular.module('ui.bootstrap.demo').controller('PaginationDemoCtrl', function ($scope, $log) {
      $scope.totalItems = 64;
      $scope.currentPage = 4;
      $scope.setPage = function (pageNo) {
         $scope.currentPage = pageNo;
      };
      $scope.pageChanged = function() {
         $log.log('Page changed to: ' + $scope.currentPage);
      };
      $scope.maxSize = 5;
      $scope.bigTotalItems = 175;
      $scope.bigCurrentPage = 1;
   });
   

2. In your view:

   
      
   Default
      
      
      
      
      
   The selected page no: {{currentPage}}
      Set current page to: 3
   
      
   
   
      
   Limit the maximum visible buttons
      
   rotate defaulted to true:
      
      
   rotate defaulted to true and force-ellipses set to true:
      
      
   rotate set to false:
      
      
   boundary-link-numbers set to true and rotate defaulted to true:
      
      
   boundary-link-numbers set to true and rotate set to false:
      
      
   Page: {{bigCurrentPage}} / {{numPages}}