1

Hi I have a simple row that I am trying to display the total of. In my html I have

 <tr ng-repeat="item in items">
        <td>{{item.name}}</td>
        <td ng-init="iTotal= iTotal + item.price">{{item.price}}</td>
    </tr>

    <tr>
        <td></td>
        <td>Total :</td>
        <td>Total:{{iTotal}}</td>
    </tr>

In my controller I have

var vm=this;
vm.Itotal=0;

This basically doesn't gives me blank for iTotal no error. Please let me know how to fix it to get the result. Thanks

6
  • 1
    Did you get item.price in your page? Commented Nov 9, 2015 at 6:33
  • 1
    items is an array in your controller, so why can't you just perform that operation in your controller, assign the result to a scope variable and display it? Commented Nov 9, 2015 at 6:34
  • yeah I got the item.price right. I get all values right just the iTotal is not showing anything Commented Nov 9, 2015 at 6:38
  • 1
    as I mentioned before, the correct way here is to perform your operation in the controller, and display it after. Commented Nov 9, 2015 at 6:42
  • create a fiddle please. Commented Nov 9, 2015 at 6:53

3 Answers 3

1

If you are using view model annotation:

var vm=this;
vm.Itotal=0;

Then you should access vm.Itotal like this:

<td ng-init="controller.Itotal = controller.Itotal + item.price">{{item.price}}</td>

Pay attention that you use iTotal in your view and Itotal (I in uppercase) in your controller.

Sign up to request clarification or add additional context in comments.

Comments

1

You can try this simple way: Demo plunker

HTML:

   <table>
 <tr ng-repeat="item in items">
        <td>{{item.name}}</td>
        <td >{{item.price}}</td>
    </tr>
    <tr>
        <td></td>
        <td>Total:{{iTotal}}</td>
    </tr>
    </table>

JS:

   $scope.items=[{
       "id": 1,
       "price": 12,
   },
   {
       "id": 1,
       "price": 1,
    }];
    $scope.iTotal=0;
    $scope.items.forEach(function(i){
        $scope.iTotal= $scope.iTotal + i.price;
    })

Comments

0

JSFiddle explaining the same: (Not created by me, Copied from JSFiddle)

http://jsfiddle.net/J9Aj8/

angular.module("app", []).
   filter("sum", function sum$$factory() {
   return function sum$$filter(collection) {
     var sum = 0;
  _.forOwn(collection, function(value) {
      switch (typeof value) {
       case 'number': sum += value; break;
       case 'string': sum += (value >>> 0); break;
       default: // don't know what to do with this, maybe something else!
       break;
     }
  });
  return sum;
};
}).
controller("itemsCtrl", function() {
  var self = this;
  this.model = {};
  this.numbers = [
    36,
    72,
    80,
    101,
    9,
    42
  ];
  this.addNumber = function() {
    var value = self.model.newNumber;
    if (value === value && typeof value === 'number') {
      self.numbers.push(value);
      self.model.newNumber = NaN;            
    }
  };
});

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.