AngularJS — Суммирование отфильтрованных строк в таблице

#angularjs

#angularjs

Вопрос:

Основываясь на этом примере, мне нужно суммировать возраст отфильтрованных пользователей. Это означает, что если у меня отфильтровано три имени, фильтр в контроллере должен суммировать только эти возрасты.

HTML

 <div data-ng-app="app" data-ng-controller="controller">
<input type="text" data-ng-model="parameter" placeholder="search">
 <p/>
 <table border="1">
 <thead>
  <tr>
    <th>#</th>
    <th>Name</th>
    <th>Age</th>
    </tr> 
<thead>
<tbody>
  <tr data-ng-repeat="user in users | filter: parameter">
    <td>{{$index 1}}</td>
    <td>{{user.name}}</td>
    <td>{{user.age}}</td>
  </tr>
 </tbody>
 <tfoot>
    <tr>
       <td colspan="2">Total ages</td>
       <td>{{users | sumByKey: 'age'}}</td>
    </tr>
 </tfoot>
 </table>
</div>
  

angularjs

 var app = angular.module("app", []);

app.filter('sumByKey', function() {
    return function(data, key) {
        if (typeof(data) === 'undefined' || typeof(key) === 'undefined') {
            return 0;
    }

    var sum = 0;
    for (var i = data.length - 1; i >= 0; i--) {
       sum  = parseInt(data[i][key]);
    }
    return sum;
    };
});
  

Есть идея?

Ответ №1:

Вы могли бы сохранить отфильтрованные данные в filteredList и передать их для вычисления,

 <tbody>
      <tr data-ng-repeat="user in (filteredList = (users | filter: parameter))">
        <td>{{$index 1}}</td>
        <td>{{user.name}}</td>
        <td>{{user.age}}</td>
      </tr>
  </tbody>
  <tfoot>
    <tr>
      <td colspan="2">Total ages</td>
      <td>{{filteredList | sumByKey: 'age'  }}</td>
    </tr>
  </tfoot>
  

ДЕМОНСТРАЦИЯ