javascript - Angular.js：如何使用 ng-bind 显示 concat。数组的元素作为字符串？

Question

我是 Angular 的新手，有一个关于 ng-bind 的基本问题，我在文档中找不到。我的场景基于 O'Reily Angular.js 书中的购物车应用程序，我似乎无法让 ng-bind 工作。

期望的输出：我需要修改我的控制器函数，以便可以在“Grand Total”范围内显示更新后的 $scope.items 数组元素。

这是功能：

 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

我建议grandTotal在你的函数上创建一个函数$scope，然后绑定它，如下所示：

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

您还可以使用插值（而不是ngBind），如第一个跨度中所示。