Angularjs Machen Sie einen Korb für Produkte

Question

Ich bin ein neuer angularjs Lerner. Ich arbeite an meinem Projekt.

 <div ng-controller="urunKontrolcusu"> 
<img id="spinner" ng-src="spinner.gif" style="visibility:hidden;width:40px;">  

       <div class="row youplay-side-news" ng-repeat="x in products"> 
       <div class="col-xs-3 col-md-4"> 
        <a href="#" class="angled-img"> 
        <div class="img"> 

         <img height="60" src="{{x.ResimLink}}" alt="{{x.UrunAdi}}"> 
        </div> 
        </a> 
       </div> 
       <div class="col-xs-9 col-md-8"> 
        <a ng-click="deleteProduct(x.id)" style="text-decoration: none; top:20px;" class="pull-right mr-10"><i class="fa fa-times"></i></a> 

        <h4 class="ellipsis"><a href="#">{{x.ProductName}}</a></h4> 
        <span class="quantity">{{x.quantity}} × <span class="amount">{{x.UnitAmount}} $</span></span> 
       </div> 
       </div> 


       <div class="ml-20 mr-20 pull-right"><strong>Total:</strong> <span class="amount"> {{quantity*UnitAmount}} $</span> 
       </div> 
       <div class="btn-group pull-right m-15"> 
       <a href="#" class="btn btn-default btn-sm">Sepeti İncele</a> 
       <a href="#" class="btn btn-default btn-sm">Ödeme Yap</a> 
       </div> 
      </div> 

Ich weiß nicht, wie ich die Gesamtmenge zeigen kann? Ich möchte einen Korb machen. Es listet Dinge auf, die der Kunde gekauft hat. Ich möchte die Gesamtmenge aller Produkte zeigen, die im Warenkorb aufgeführt sind. bitte helfen Sie mir

Answer 1

HTML

<div>Total: {{ getTotal() }}</div> 

JavaScript

$scope.getTotal = function(){ 
    var total = 0; 
    for(var i = 0; i < $scope.products.length; i++){ 
     var product = $scope.products[i]; 
     total += (product.price * product.quantity); 
    } 
    return total; 
} 

---

Alternative Lösung:

In Ihrem ng-repeat hinzufügen:

ng-init="itemTotal = product.price * product.quantity; total = total + itemTotal" 

Dann in Ihrem Controller speichert der Umfang variable $scope.total und es am Ende nennt mit <div>Total Price: {{ total }}</div>