javascript - 如何对 ng-repeat 内的动态文本框值求和

Question

我正在创建一个动态表单字段，其中 ng-repeat 内只有一个输入类型数字字段，用户可以通过单击添加按钮添加任意数量的字段，现在我需要计算动态中输入的值的总和数字字段并在文本框中更新，下面我粘贴我的代码供您引用，帮助我解决

      <fieldset ng-repeat="field in table.fields track by $index" >

 <input type="number" ng-model="table.fields[$index].item_count" class="form-control" name="item_count" ng-pattern="/^[0-9]/" placeholder="Category Item View Count" required>

  <button ng-click="removeChoice()" class="remove btn btn-danger" >close</button>
     </fieldset>


      <button class="addfields btn btn-success" ng-click="addFormField()" ng-disabled="!frm.cat_name.$dirty||!frm.cat_desc.$dirty||frm.cat_desc.$invalid||frm.cat_name.$inavalid">Add fields</button>

Answer 1

只需创建一个自定义过滤器来对您的数字求和:

angular.module('App').filter('mysum', function() {
  return function(items) {
    var sum = 0;
    items.forEach(function(item) {
      if (item.item_count) {
         sum += item.item_count;      
      }
    })
    return sum;
  }
})

然后用它来显示总和:

<span>{{ table.fields | mysum }}</span>