AngularJS - How to sum filtered grandchild items in nested ng-repeat

Question

I created a kanban board app with Angular, now I'd like to put the sum of filtered Post-Its points, and a count, like so:

<input type="text" ng-model="searchText">

<div ng-init="col.TotalPoints = 0" ng-repeat="col in columns">
    <h3>{{col.Title}} - ({{ col.TotalPoints?? }} Pts.)</h3>
    <div ng-init="subCol.Points = 0" ng-repeat="subCol in col.SubColumns">
        <h3>{{subCol.Title}} - {{ subCol.Points }} Pts.</h3>
        <div ng-show="false" ng-bind="subCol.Points= (filteredPostIts| sumPointsFilter:'Points')" ></div>
        <div ng-repeat="postIt in filteredPostIts = (subCol.PostIts | filter:searchText)">
            <p>#{{postIt.Id}}</p>
            <p>{{postIt.Title}}</p>
            <p>{{postIt.UserName}}</p>
            <p>{{postIt.Points}} Points</p>
        </div>
    </div>
</div>

I assign my filtered Post-Its to filteredPostIts alias, then used to ng-bind to use the sumPointsFilter to iterate over all filtered post-its and sum their points, which is working fine. The Sub-Column Points is recalculated as soon as we start filtering some post-its by typing some text in the search input.

Now I'd like to calculate the total points for the whole column, which is the sum of its subcolumns (considering the filtered post-its).

This is a JSFiddle. The first column is "Não Iniciado" (Not started), which has one subcolumn called "Backlog". The second column is "Em andamento", which has two subcolumns ("Executando" and "Aguardando").

Try typing marcello for example, and it will filter Marcello's post-its, and recalculate the points for the subcolumns.

How could I achieve this?

Answer 1

You do have quite a bit going on that jsfiddle but I think I see what you could do...

Reuse that same summation filter like this:

<h3>{{col.Titulo}} - ({{ col.Divisorias | sumPointsFilter: 'Points'}} Pts.)</h3>

https://jsfiddle.net/r0m4n/9zbrohhy/54/