Отфильтрованное раскрытие (с использованием выделения) С накопленными суммами (ng-repeat)

Question

Надеясь, что кто-то сможет пролить свет на мою проблему. У меня есть раскрывающийся список AgularJS, который отображает ряд пользователей. В зависимости от того, какой пользователь вы выберете, он покажет некоторые данные, на которые ссылается идентификатор пользователя. Все отлично работает! Проблем нет.

Я хотел попытаться принять эти результаты и выполнить некоторые математические операции. В моем примере ниже, когда пользователь выбран, он покажет день недели и «оценку». Я хотел бы попытаться накопить счет в конце каждой строки.

FIDDLE: http://jsfiddle.net/bfoyhycy/1

<tr ng-repeat="eachItem in Data |filter: { id: selectedOption.id }"> 
     <td>{{eachItem.day}}</td> 
     <td>{{eachItem.score}}</td> 
     <td> <!---- NO IDEA WHAT TO DO HERE ----> </td> 
    </tr> 

Я думал, что я мог бы сослаться на данные и использовать их в индекс, но это не будет работать, потому что я ее фильтрации на основе «ид». Таким образом, накопленная сумма будет корректной для первого пользователя, но неверна для остальных (это можно увидеть, если вы выберете пользователя «Фрэнк»).

FIDDLE: http://jsfiddle.net/bfoyhycy/2/

<tr ng-repeat="eachItem in Data |filter: { id: selectedOption.id }"> 
     <td>{{eachItem.day}}</td> 
     <td>{{eachItem.score}}</td> 
     <td>{{Data[$index-1].score}}</td> 
    </tr> 

Я хотел бы знать, если есть способ, чтобы получить предыдущее значение строки во время нг-повторить? Сначала я думал, что вы можете сделать {{eachItem [$ index-1] .score}}, но, видимо, вы не можете. Если у кого-нибудь есть идеи, как решить эту проблему, мы будем очень благодарны! Пожалуйста, дайте мне знать, если мне нужно предоставить дополнительную информацию. Надеюсь, все это имело смысл!

Спасибо! T

Answer 1

Вы можете назначить отфильтрованные элементы переменной с именем filteredData как это ...

<tr ng-repeat="eachItem in filteredData = (Data |filter: { id: selectedOption.id })"> 

И теперь вы можете использовать $index правильно ...

<td>{{ filteredData[$index-1].score }}</td> 

Чтобы получить истинное общая сумма, вам действительно нужно сделать немного больше. Один из способов сделать это с ngInit, хотя я должен сказать, что это становится довольно Hacky на данный момент, но это работает ...

<tr ng-repeat="eachItem in filteredData = (Data |filter: { id: selectedOption.id })" 
     ng-init="eachItem.runningTotal = filteredData[$index-1].runningTotal + eachItem.score"> 
     <td>{{eachItem.day}}</td> 
     <td>{{eachItem.score}}</td> 
     <td>{{eachItem.score + filteredData[$index-1].runningTotal}}</td> 
    </tr> 

Live Demo

Возможно, лучшим решением является создание настраиваемый фильтр, который выводит фильтрованный массив с заранее рассчитанными текущими итогами.