2016-04-29 51 views
4

我正在使用Angular的購物車上工作,在此過程中我遇到了有關計算的問題。在角度視圖上的調整

在我的情況我有代碼類似

<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; 
    } 

優點是你可以通過對象的整個列表直接得到一個電話總車價值。而不是在迭代過程中每次計數。