I want to apply a limit and a filter to my AngularJS loop, but the filter is not working on the entire list, only on the limited list...

I have 100 agreements and I want to show only 20, but I want to add a filter to search on the other 90 agreements...

**Edit #2 :**

```js
    app.controller("AgreementsController", function($scope, $http) {
      $scope.agreements = [];
      $http.get('/api/agreement').success(function(data, status, headers, config) {
        $scope.limit = data.limit;
        data.agreements.forEach( function(agr){
          $scope.agreements.push(agr);
        });
      });
    });
```

```html
<input type="text" ng-model="search">
<table>
  <thead>
    <tr>
      <th>number</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="agreement in agreements | filter:search | limitTo:5">
      <td>{{agreement.number}}</td>
    </tr>
  </tbody>
</table>
```

Edit #3 :

![My data model](https://i.stack.imgur.com/0Xg84.png)