AngularJS - Updating .length when filtering data

Question

I have a simple ng-repeat at displays a chunk of data.

The users can filter the data by typing in values in the textbox.

On page load, i am performing a .length for the total items in my $scope.. What i want to try to do is that when a user enters a value in the textbox, to have this .length to update to the number of results found:

HTML:

<p>Original Results found: {{ items.length }}</p>

<p>Updated Results found: {{ i.length }}</p>

<br>

<div>
  <ul>
    <li ng-repeat="i in items | filter: searchText | limitTo: limit">{{ i.Title }}</li>
  </ul>
</div>

<br>


<input ng-model="searchText">
<button ng-click="performSearch(searchText)">Submit</button>

Here's my plunker: http://plnkr.co/edit/B0gHuI3z8XUsTidXrl4V?p=preview

Answer 1

You can store the filtered array in a temporary array

<p>Original Results found: {{ items.length }}</p>

<p>Updated Results found: {{ filteredArray.length }}</p>

<br>

<div>
  <ul>
    <li ng-repeat="i in filteredArray = (items | filter: searchText) | limitTo: limit">              {{ i.Title }}</li>
  </ul>
</div>

<br>


<input ng-model="searchText">
<button ng-click="performSearch(searchText)">Submit</button>

Working plunker:

http://plnkr.co/edit/c5Rg8v45Z6TYV19Ss0Fx?p=preview