sum of the all sum column in angularjs -


i have length , breath,based o calculating area(l*b),suppose have many field different length , breath,area calculating need sum of area column,so how add sum of above field in 1 new text box??? need sum of num3(area).

my code below ......

<!doctype html>  <html>  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>  <body>       <div ng-app="myapp" ng-controller="mainctrl">      <form  data-ng-repeat="choice in choices">   length:<input type="number" ng-model="num1"  />   width: <input type="number" ng-model="num2"  />   area: <input id="area" type="number" ng-model="num3" placeholder="area" value="{{ num1 * num2 }}" />    <button  ng-show="$last" ng-click="removechoice()">-</button>        </form>  	<button  ng-click="addnewchoice()">add fields</button>        </div>             <script>  var app = angular.module('myapp', []);      app.controller('mainctrl', function($scope) {   $scope.choices = [{id: 'choice1'}, {id: 'choice2'}];        $scope.addnewchoice = function() {      var newitemno = $scope.choices.length+1;      $scope.choices.push({'id':'choice'+newitemno});    };          $scope.removechoice = function() {      var lastitem = $scope.choices.length-1;      $scope.choices.splice(lastitem);    };           });  </script>    </body>  </html>

i don't know easy solution in case.

you can't value="{{ val + val2 }}" because displaying value not change model.

a possible solution :

<form  data-ng-repeat="choice in choices">     length:<input type="number" ng-model="choice.length"  />     width: <input type="number" ng-model="choice.width"  />     area: <input id="area" type="number" placeholder="area" value="{{ choice.length * choice.width }}" />     <button  ng-show="$last" ng-click="removechoice()">-</button>  </form> <button  ng-click="addnewchoice()">add fields</button>  result : {{ sum() }}

in controller :

$scope.choices = [{id: 'choice1', length:0, width: 0}, {id: 'choice2', length:0, width: 0}];    $scope.addnewchoice = function() {     var newitemno = $scope.choices.length+1;     $scope.choices.push({'id':'choice'+newitemno});   };    $scope.removechoice = function() {     var lastitem = $scope.choices.length-1;     $scope.choices.splice(lastitem);   };      $scope.sum = function() {         var sum = 0;         angular.foreach($scope.choices, function(choice) {             sum += choice.length * choice.width;         });         return sum;     }

Comments

Post a Comment