Angular.js: Jak używać ng-bind do wyświetlania konkat. elementy tablicy jako ciąg znaków?

Question

Jestem nowy w Angular i mam podstawowe pytanie dotyczące ng-bind, którego nie mogłem znaleźć w dokumentacji. Mój scenariusz opiera się na aplikacji koszyka na zakupy w książce O'Reily Angular.js i nie mogę sprawić, że ng-bind zadziała.

Wymagane wyjście: Potrzebuję zmodyfikować funkcję kontrolera, aby móc wyświetlać zaktualizowane elementy tablicy $ scope.items w zakresie "Grand Total".

Oto funkcja:

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

Polecam dokonywania grandTotal funkcji na $scope a następnie wiązanie, że tak:

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

Można również użyć interpolacji (zamiast ngBind), jak wskazano w pierwszym przęśle.