3

According to the accepted answer to this question, if I want to display the length of filtered ng-repeat data I would do:

<div ng-repeat="person in filtered = (data | filter: query)">
</div>

Display the number of results:

Showing {{filtered.length}} Persons

My question is, how would I display the length of the data with that simple query filter when I am also using a limitTo filter: 

<div ng-repeat="person in data | filter: query | limitTo: itemsPerPage">
</div>

To be clear, if there are 100 items resulting from data | filter: query and itemsPerPage = 10, then in my case I want filtered.length to be 100, instead of the 10 I get from doing:

<div ng-repeat="person in filtered = (data | filter: query) | limitTo: itemsPerPage">
</div>

Is there a way to get the length of the filtered results from an earlier filtering in the chain, while still applying more filters down the chain that potentially affect the length of the filtered results?

Community
  • 1
  • 1
adamconkey
  • 4,104
  • 5
  • 32
  • 61
  • I don't understand how the `limitTo`'s supposed to work in your example. If the filtered number of results is higher than the limit, then you want to display them all? That doesn't make sense – New Dev Jul 15 '15 at 20:21
  • It's the way I've done pagination; this is not my full code but it captures the essence of what I need. I want the value of the length of the results that come out of the query filter, but then ultimately only `itemsPerPage` of those results will be displayed – adamconkey Jul 15 '15 at 20:24
  • Your last attempt should achieve what you want then – New Dev Jul 15 '15 at 20:30
  • 3
    Is this what you need: http://jsfiddle.net/w3ysafo2/7/ ? – IvanMalenko Jul 15 '15 at 20:43

1 Answers1

1

I needed the same thing and am surprised no one ever answered this... but your last attempt got me 90% of the way, it just needs an extra pair of brackets:

<div ng-repeat="person in (filtered = (data | filter: query)) | limitTo: itemsPerPage">
</div>

To also get the final list, we can use an alias:

<div ng-repeat="person in (filtered = (data | filter: query)) | limitTo: itemsPerPage as visibleItems">
</div>

filtered will have the entire filtered list and visibleItems will have only those that are visible after the limitTo is applied.

FruityOatyBar
  • 58
  • 6