Angular.js: Come utilizzare ng-bind per visualizzare concat. elementi di una matrice come una stringa?

Question

Sono nuovo di Angular e ho una domanda di base su ng-bind che non ho trovato nella documentazione. Il mio scenario si basa sull'app del carrello degli acquisti nel libro O'Reily Angular.js e non riesco a trovare il modo migliore per funzionare.

Output desiderato: Ho bisogno di modificare la mia funzione di controller in modo da poter mostrare i miei elementi di array $ scope.items aggiornati in un intervallo 'Grand Total'.

Qui è la funzione:

function CartController($scope) { 
    $scope.items = [ 
     {title: 'Software', quantity: 1, price: 1399.95}, 
     {title: 'Data Package (1TB)', quantity: 1, price: 719.95}, 
     {title: 'Consulting (per hr.)', quantity: 1, price: 75.00} 
    ]; 

    $scope.remove = function(index) { 
     $scope.items.splice(index, 1); 
    }, 

    $scope.reset = function(index) { 
     $scope.items = [ 
     {title: 'Software', quantity: 0, price: 1399.95}, 
     {title: 'Data Package (1TB)', quantity: 0, price: 719.95}, 
     {title: 'Consulting (per hr.)', quantity: 0, price: 75.00} 
    ]; 

    }; 
} 

Answer 1

consiglierei di effettuare una funzione grandTotal sul $scope e poi vincolante che, in questo modo:

http://jsfiddle.net/XMTQC/

HTML

<div ng-app ng-controller="CartController"> 
    Grand Total: <span>{{grandTotal()}}</span> 
    <br/> 
    Grand Total: <span ng-bind="grandTotal()"></span> 
    <br/> 
</div> 

JavaScript

$scope.grandTotal = function() { 
    return $scope.items.reduce(function (p, c) { 
     return p.price || p + c.price; 
    }); 
}; 

È anche possibile utilizzare l'interpolazione (anziché ngBind) come indicato nella prima span.