Angularjs ng-repeat filter

Question

I was looking for a solution to use the angles built into the filter with a different dataset than the one used for ng-repeat, but I did not find anything.

For example, in this code snippet, the filter will filter the data only internally filteredPages, but the problem is that filteredPages- this is only the first page paginated, I want to filter the source data that filteredPagesis created from.

 <tr ng-repeat="rate in filteredPages | filter:search | orderBy:sortType:sortReverse ">
        <td data-title="'location'">{{rate.location}}</td>
        <td data-title="'code'">{{rate.code}}</td>
        <td data-title="'peak_charge'">{{rate.charge_peak}}</td>
        <td data-title="'offpeak_charge'">{{rate.charge_offpeak}}</td>
       <td data-title="'connnection_charge'"> {{rate.connection_charge}}</td>
 </tr>

filteredPages

 $scope.$watch('currentPage', function () {
    //Define the pagination functionality....
    var begin = (($scope.currentPage - 1) * $scope.numPerPage)
    var end = begin + $scope.numPerPage;
    $scope.filteredPages = $scope.list_data.slice(begin, end);

    return $scope.filteredPages;
});

$scope.list_datais the data that I would like to filter. $scope.filteredPages- This is a paginated result, so when you use a filter, it only searches on the page on which you are currently located.

ng-model search

<div class="form-group">
            <input type="text" ng-disabled="check" ng-model="search" class="form-control" placeholder="Filter By">
</div>

, ? - , , . .

Answer 1

list_data limitTo ( begin)

var myApp = angular.module('myApp', []).controller("MyCtrl", MyCtrl);

function MyCtrl($scope) {
  $scope.currentPage = 1;
  $scope.list_data = [{item: '1'}, {item: '2'}, {item: '3'}, {item: '4'}, {item: '5'}, {item: '6'}, {item: '7'}, {item: '8'}, {item: '9'}, {item: '10'}, {item: '11'}, {item: '12'}, {item: '13'}, {item: '14'}, {item: '15'}];

  $scope.numPerPage = 5;
  $scope.begin = (($scope.currentPage - 1) * $scope.numPerPage)
  $scope.end = $scope.begin + $scope.numPerPage;
  $scope.search = null;


  $scope.$watch('currentPage', function() {
    //Define the pagination functionality....
    $scope.begin = (($scope.currentPage - 1) * $scope.numPerPage)
    $scope.end = $scope.begin + $scope.numPerPage;
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="MyCtrl">
    <input type="text" ng-model="search" />
    <table>
      <tr ng-repeat="rate in list_data | filter:search | limitTo:end:begin ">
        <td data-title="'location'">{{rate.item}}</td>
      </tr>
    </table>
  </div>
</div>

Hide result

orderBy,

Answer 2

, : ng-repeat="row in pageRows = (data | filter:search) | limitTo:itemsPerPage:itemsPerPage*(currentPage-1)"

JS. , ng bootstrap uib-pagination.