Counting the total of nested ng-repeats and updating multiple controllers/models in angularjs

Question

In my current project I have a two nested ng-repeats, where the outer ng-repeat provides an argument the inner ng-repeat needs to filter out the data + some additional custom filtering on the controller. I'd like to know what the total filtered count is of the inner nested elements for the whole overview of the dataset.

Consider the following stripped down structure:

<div ng-repeat="division in divisions">
    <!-- some division related stuff like logo, name, ... comes here (header of the division) -->
    <ol>
      <li ng-repeat="member in members | orderBy:['position'] | filter:{divisionabbr:division.abbr} | filter:myCustomFilter"><!-- some member stuff here, like name --></li>
    </ol>
    <!-- some division footer stuff -->
</div>

My question is: how can I get the total number of filtered members and thus displaying on the whole page.

As an extra I'd like to have this count on my controller/scope so that I can communicate it to other controllers.

I've tried the following solutions:

https://stackoverflow.com/a/20900403/341358 (see my comment, this count isn't updating correctly on data reloads/partial dataset refreshes)
https://stackoverflow.com/a/19517533/341358 (doesn't work with nested ng-repeat because of scope issues)

Any suggestions?

score 1 · Accepted Answer · answered Mar 05 '14 at 14:27

You can create a filtered members object, like:

$scope.filteredMembers = {};

and then populate it like this:

<div ng-repeat="division in divisions">
    <!-- some division related stuff like logo, name, ... comes here (header of the division) -->
    <ol>
      <li ng-repeat="member in filteredMembers[division] = (members | orderBy:['position'] | filter:{divisionabbr:division.abbr} | filter:myCustomFilter)"><!-- some member stuff here, like name --></li>
    </ol>
    <!-- some division footer stuff -->
</div>

After that, just iterate over the filteredMembers and sum their lengths. Because it's in the scope, you'll also have this available in your controller.

There is no easy/native way to do it.

You're welcome! :) @Oledje, if you steal others' ideas (and downvote them), at least have as much dignity to change the variable names... — Shomz, Mar 05 '14 at 15:13
@Shomz If you look closely, you'll see that my approach is completely different from yours (except for the same variable name that was an accident) — Goodnickoff, Mar 05 '14 at 15:17

score 0 · Answer 2 · answered Mar 05 '14 at 14:29

0

This is the working example:

http://jsfiddle.net/Kb27R/1/

but there not so many filters like in your code.

I used this approach there: ng-repeat="member in filteredMembers = ( members | filter:{divisionabbr:division.abbr})"

answered Mar 05 '14 at 14:29

Goodnickoff

2,267
1
15
14

I do not understand what a minus? There is a working example with counting the total number of members: http://jsfiddle.net/Kb27R/4/ – Goodnickoff Mar 05 '14 at 15:01
1

If all you're doing is constructing a fiddle based on code from another post, you should post it as a comment instead. If you're trying to answer the question, you might want to explain what is happening in your code. Right now, it doesn't look like an answer so much as simply saying "I put your code in a fiddle." – BoltClock Mar 05 '14 at 15:30
@BoltClock I wrote this example is not based on the other. Time difference between our responses about two minutes. At the time of publication, I have not seen this response. – Goodnickoff Mar 05 '14 at 15:38
2

Fair enough - either way I feel your answer could be very much improved. A simple link to jsFiddle isn't much of an answer. – BoltClock Mar 05 '14 at 15:42
Sometimes one link to jsFiddle more useful than 100 lines of text. – Goodnickoff Mar 05 '14 at 16:05

Counting the total of nested ng-repeats and updating multiple controllers/models in angularjs

2 Answers2