如何添加数组（或）Json 中存在的值？

Question

我想知道是否有人解决了我的问题。我的代码如下所示。

var app = angular.module('myApp', []);
app.controller('myCtrl',function($scope){
 //Adding New Check# and Check amount Text Boxes
         $scope.checks = [{checkNum1: '',checkAmt1:''}];


             $scope.add = function() {
               var newCheckNo = $scope.checks.length+1;
               $scope.checks.push({['checkAmt'+newCheckNo]:''});
             };
             
             $scope.tot = function() {
             		return  $scope.checks;
             };
             
             $scope.total = function() {
             		var value = "";
                	for(var i =0 ; i<=$scope.checks.length;i++ ){
                  		value += $scope.checks.get('checkAmt1');
                  }
                return value;
             };

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<div class="col-md-12">
<div class="col-md-6">
         <div ng-repeat="check in checks">
               <div class="form-group">
              <label>check Amount:</label>
               <div class="col-md-5">
                <input type="text" class="form-control" id="{{'id'+($index+1)}}" ng-model="check['checkAmt'+($index+1)]" maxlength="6" />
               </div>
               </div>
             </div>
             <button type="button"
              ng-click="add()">Add More</button>
            </div>
</div>
<div class="col-md-6">
   <!--<p ng-repeat="check in checks">{{check['checkAmt'+($index+1)]}}</p>-->
</div>
  <label>{{tot()}}</label>
  <label>{{total()}}</label>
</div>

我正在初始化$scope.checks = [{checkAmt1:''}]; 并在单击添加按钮时推送附加值（checkAmt2、checkAmt3、...等等）。我想通过使用{{total()}} 动态添加这些值（checkAmt1+checkAmt2+...等等）。 total() 函数正在调用，我知道 for 循环内的逻辑是错误的。请帮我解决逻辑（或）如果有任何其他方式来添加这些值，请建议我。

提前致谢。

注意：请以整页查看结果。

Answer 1

首先，这不是使用数组的正确方法。 您可以总结具有相同名称而不是动态名称的列。

我认为要使您以这种方式使用的条目与众不同。但这不是好方法，并且会使您对数组的操作变得复杂。

你可以尝试以下方式构造数组，

 $scope.checks = [{id:'',checkNum: '',checkAmt:''}];

完整修改后的代码如下所示

var app = angular.module('myApp', []);
app.controller('myCtrl',function($scope){
 //Adding New Check# and Check amount Text Boxes
         $scope.checks = [{id:'', checkAmt:''}];


             $scope.add = function() {
               var newCheckNo = $scope.checks.length+1;
               $scope.checks.push({'id':newCheckNo ,'checkAmt':''});
             };
             
             $scope.tot = function() {
               return  $scope.checks;
             };
             
             $scope.total = function() {
               var value = 0;
                 for(var i =0 ; i<$scope.checks.length;i++ ){
                    value += parseInt( $scope.checks[i].checkAmt);

                  }
                return value;
             };

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<div class="col-md-12">
<div class="col-md-6">
         <div ng-repeat="check in checks">
               <div class="form-group">
              <label>check Amount:</label>
               <div class="col-md-5">
                <input type="text" class="form-control" id="{{'id'+($index+1)}}" ng-model="check['checkAmt']" maxlength="6" />
               </div>
               </div>
             </div>
             <button type="button"
              ng-click="add()">Add More</button>
            </div>
</div>
<div class="col-md-6">
   <!--<p ng-repeat="check in checks">{{check['checkAmt']}}</p>-->
</div>
  <label>{{tot()}}</label>
  <label>{{total()}}</label>
</div>

Answer 2

我不确定为什么你确实将这样的对象推送到数组中，而不仅仅是数字，而是当你迭代它时 - 你可以通过索引访问每个值，然后获取正确的对象的值：

for(var i =0 ; i<=$scope.checks.length;i++ ){
   value += $scope.checks[i]['checkAmt' + i];
}