How to add up AngularJs iterated values in view?

Question

Suppose I am doing this

<div ng-repeat="order in orders">
   <p>order.productname</p>
   <p>order.productvalue</p>

</div>

Is there a way to calculate the total of all the productvalues in the view itself, or do I need to create a function in the controller?Can anyone point me to the right direction please? thanks

As far as I know there are no built-in methods, so the simplest way is to define sum function in $scope — Artem Petrosian
– Artem Petrosian, Commented May 18, 2014 at 20:22

JoakimB · Accepted Answer · 2014-05-18 20:25:11Z

2

I would do something like this

In controller

$scope.numberOfItems= function(items){
  return items.length;
}

in template

{{numberOfItems(orders)}}

answered May 18, 2014 at 20:25

JoakimB

1,2062 gold badges14 silver badges20 bronze badges

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

Comments

van100j · Accepted Answer · 2014-05-18 20:24:57Z

1

You'll need to create a sum function in your controller which will calculate total:

<div ng-repeat="order in orders">
    <p>{{order.productname}}</p>
    <p>{{order.productvalue}}</p>
</div>
<div>
    <p>Total: {{total}}</p>
</div>

Or you can create a filter as in http://cacodaemon.de/index.php?id=55 and have the total sum directly filtered in your view:

<div ng-repeat="order in orders">
    <p>{{order.productname}}</p>
    <p>{{order.productvalue}}</p>
</div>
<div>
    <p>Total: {{orders|sumByKey:'productvalue'}}</p>
</div>

answered May 18, 2014 at 20:24

van100j

1,0179 silver badges22 bronze badges

Collectives™ on Stack Overflow

How to add up AngularJs iterated values in view?

2 Answers 2

In controller

in template

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

In controller

in template

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related