2016-04-29 2 views
4

Я работаю над тележкой, используя Angular, во время процесса я столкнулся с проблемой расчета.Calulation on Angular View

В моем случае у меня есть что-то вроде кода

<label>No. of item</label> 
<div>{{totalItems}}</div> 


<div ng-repeat="cartElement in currentCartDetails.cartElements"> 
     <span>{{cartElement.productName}}</span> 
     <span>{{cartElement.productCode}}</span> 
     <span>{{cartElement.productPrice}}</span> 
     <span>{{cartElement.quantity}}</span> 
    </div> 

То, что я хочу, добавить все что-то вроде

totalItems += cartElement.quantity 

Я знаю, что есть очень много вариант для отображения значения например. используя расчет со стороны сервера, итерацию в расчете на контроллер

Но что я ищу, когда я повторяю объект на странице просмотра, есть какой-либо способ рассчитать там и получить преимущество привязки буксирного пути.

ответ

2

Вы пытались сделать это с функцией? Определите функцию внутри вашего контроллера, например calculateTotal, затем назовите ее для каждой итерации.

$scope.totalItems = 0; 
... 
$scope.calculateTotal = function(cart){ 
    $scope.totalItems += cart.quantity; 
} 
... 

затем в шаблоне

<div ng-repeat="cartElement in currentCartDetails.cartElements" ng-init="calculateTotal(cartElement)"> 
    <span>{{cartElement.productName}}</span> 
    <span>{{cartElement.productCode}}</span> 
    <span>{{cartElement.productPrice}}</span> 
    <span>{{cartElement.quantity}}</span> 
</div> 
+0

Большое вам спасибо, чтобы уменьшить один шаг итерации в контроллере, я просто забыл об этом процессе. – Sach

0

Вы также можете достичь этого,

Метод 1:

HTML:

<div>{{gettotalItems(currentCartDetails.cartElements)}}</div> 

JS:

$scope.gettotalItems = function(cart_data){ 
    var num = 0; 
    for(var i=0;i<cart_data.length;i++) { 
     num += cart_data[0].quantity; 
    } 
    return num; 
} 

Метод 2:

HTML:

<div ng-init="gettotalItems(currentCartDetails.cartElements)>{{totalItems}}</div> 

JS:

$scope.gettotalItems = function(cart_data){ 
     var num = 0; 
     for(var i=0;i<cart_data.length;i++) { 
      num += cart_data[0].quantity; 
     } 
     $scope.totalItems = num; 
    } 

преимуществом является то, вы можете получить общую стоимость корзины непосредственно в одном вызове, передавая весь список объектов , а не, подсчитывая каждый раз во время итерации.