javascript - Iterate through several ng-model -

javascript - Iterate through several ng-model -

i had set of ng-model elements , and want sum values , display it. set looks these

<div ng-app> <div ng-controller="sumapp" > <input ng-model='val1' type='number' ng-change='calculate()' ng-init='val1=0'/> <input ng-model='val2' type='number' ng-change='calculate()' ng-init='val2=0'/> <input ng-model='val3' type='number' ng-change='calculate()' ng-init='val3=0'/> <input ng-model='val4' type='number' ng-change='calculate()' ng-init='val4=0'/> <div>{{sum}}</div> </div> </div>

and controller looks these

<script type="text/javascript"> function sumapp($scope) { $scope.sum = 0; $scope.calculate = function() { $scope.sum = $scope.val1+$scope.val2+$scope.val3+$scope.val4 }; } </script>

so html models generate dynamically

the question if there way can iterate through set of elements ng-model without using list in controller definition itself ?

knowing exact number of inputs @ time can utilize loop sum them up:

$scope.sum = 0; $scope.numinputs = 5; $scope.calculate = function() { var i; $scope.sum = 0; for(i = 0; < $scope.numinputs; i++) { $scope.sum += parseint($scope['val' + i], 10); } };

javascript angularjs