title: How to implement angularJS Pagination
body: <p>I am facing issue with pagination. I have tried several answers including custom filters and every time the data is not displayed. I know the data is been fetched and its present in DOM but I can't seem to figure out why its not displaying the data.</p>
  
  <p>Pagination Controls:</p>
  
  <pre><code>// pagination controls
      $scope.currentPage = 1;
      $scope.totalItems = $scope.searchDataValues.length;
      $scope.entryLimit = 8; // items per page
      $scope.noOfPages = Math.ceil($scope.totalItems / $scope.entryLimit);
      $scope.pageChanged    = pageChanged;
      $scope.paginatedList = $scope.searchDataValues.slice(0, $scope.entryLimit);
  
      function pageChanged(){
  
          var begin = (($scope.currentPage - 1) * $scope.entryLimit),
              end   = begin + $scope.entryLimit;
  
          $scope.paginatedList = $scope.searchDataValues.slice(begin, end);
  
      }
  </code></pre>
  
  <p>HTML Side code:</p>
  
  <pre><code>&lt;pagination
             ng-change="pageChanged()"
             total-items="totalItems"
             items-per-page="entryLimit"
             ng-model="currentPage"
             max-size="noOfPages"
             class="pagination-sm"
             boundary-links="true"&gt;
  &lt;/pagination&gt;
  </code></pre>
  
  <p>Ng-repeat filter: </p>
  
  <pre><code>&lt;tr ng-repeat="data in searchDataValues | orderBy:sortKey:reverse | startFrom:(currentPage-1)*entryLimit | limitTo:entryLimit "&gt;
  </code></pre>
  
  <p>Start From filter:</p>
  
  <pre><code>app.filter('startFrom', function () {
  return function (input, start) {
      if (input === undefined || input === null || input.length === 0) return [];
      start = +start; //parse to int
      console.log(input.slice(start))
      return input.slice(start);
  }
  });
  </code></pre>