AngularJS数组-如果相同类别如何添加金额

时间:2018-08-10 04:37:40

标签: javascript arrays angularjs

如果在角度上具有相同类别,如何添加金额并删除重复的条目。

例如:

self.lineDetails = [{id:'0',category:'AAA',amount:'500'},
                    {id:'1',category:'BBB',amount:'200'},
                    {id:'2',category:'AAA',amount:'300'}]

所需的输出:

self.newLineDetails = [{id:'0',category:'AAA',amount:'800'},
                    {id:'1',category:'BBB',amount:'200'}]

2 个答案:

答案 0 :(得分:1)

您可以使用angularjs过滤器分组依据

演示

var myApp = angular.module('myApp', ['angular.filter']);

myApp.controller('MyController', function($scope) {
	$scope.data = [{id:'0',category:'AAA',amount:'500'},
                    {id:'1',category:'BBB',amount:'200'},
                    {id:'2',category:'AAA',amount:'300'}];

	$scope.getAmountSum = function(items) {
  	return items
    .map(function(x) { return x.amount; })
    .reduce(function(a, b) { return parseInt(a) + parseInt(b); });
  };

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.8/angular-filter.js"></script>
<div ng-app="myApp" ng-controller="MyController">
  <ul>
    <li ng-repeat="(key, items) in data | groupBy: 'category'">
      category: {{items[0].category}}, amount: {{getAmountSum(items)}}
    </li>
  </ul>
</div>

答案 1 :(得分:1)

您可以尝试在angular js中创建地图类型的json,如下所示:

self.lineDetails = [{id:'0',category:'AAA',amount:'500'},
                    {id:'1',category:'BBB',amount:'200'},
                    {id:'2',category:'AAA',amount:'300'}];
self.lineDetailsMap = {};
angular.forEach(self.lineDetails, function(lineDetail)    {
     if(self.lineDetailsMap[lineDetail.category] !== undefined)    {
          var lineDetailOld = self.lineDetailsMap[lineDetail.category] ;
          lineDetail.amount = parseInt(lineDetailOld.amount) + parseInt(lineDetail.amount);
     }
     self.lineDetailsMap[lineDetail.category] = lineDetail;

});

现在您可以遍历此地图以获取新列表:

self.newLineDetails = [];
angular.forEach(self.lineDetailsMap,function(value,key)     {
    self.newLineDetails.push(value);
});

让我知道您是否遇到任何问题