如何在本地存储中显示值的总和?

How to display sum of values in local-storage?

我在下面有本地存储值:

[{"id":1, "amount":24000000}, {"id":2, "amount":10000000}]

如何对本地存储中的金额求和?。我使用 AngularJS.

在 jsp 中显示我的本地存储

我的控制器:

$scope.listOfCart = CartService.getAllCarts()||[];
$scope.items = $scope.listOfCart

我的 jsp :

<tr data-ng-repeat="cart in items">
    <td>{{cart.amount}}</td>
</tr>

那么如何显示求和金额?

我假设来自本地存储的数据数组在 $scope.items

在这种情况下,您可以将新的 amount 设置为通过使用 reduce 对项目的值进行迭代求和而构建的范围。

$scope.amount = $scope.items.reduce((result, item) => {
  return item['amount'] + result;
}, 0);

在这种情况下会给出结果 34000000

您可以遍历 listOfCart 并在从 CartService 收到数据后计算总金额。

   $scope.sumAmount = 0;
   angular.forEach($scope.listOfCart , function(value, key){
       $scope.sumAmount = $scope.sumAmount + value.amount;
   });

在你的 html

<tr data-ng-repeat="cart in items">
    <td>{{cart.amount}}</td>
</tr>
Total : {{sumAmount}}

为此,您需要计算控制器内的总量。

这里使用HTML中的totalAmount变量显示总金额

控制器

$scope.listOfCart = CartService.getAllCarts()||[];
$scope.items = $scope.listOfCart;
$scope.totalAmount = 0;
$scope.items.forEach(function(item){
    $scope.totalAmount += item.amount;
});

HTML

<tr data-ng-repeat="cart in items">
    <td>{{cart.amount}}</td>
</tr>

Total Amount: {{totalAmount}}

在html中:

<td>{{sumValues()}}</td>

在控制器中

$scope.sumValues= function(){
    var sum= 0;
    angular.forEach($scope.listOfCart , function(value, key){
        sum += value.amount;
    });
    return sum;
}