How to add the amount if they have same category in angular and remove the duplicate entry.
For example:
self.lineDetails = [{id:'0',category:'AAA',amount:'500'},
{id:'1',category:'BBB',amount:'200'},
{id:'2',category:'AAA',amount:'300'}]
Desired Output:
self.newLineDetails = [{id:'0',category:'AAA',amount:'800'},
{id:'1',category:'BBB',amount:'200'}]
You can use the angularjs filter groupBy
DEMO
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>
You can try creating a map sort of json in angular js as :
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;
});
Now you can iterate upon this map to fetch the new list:
self.newLineDetails = [];
angular.forEach(self.lineDetailsMap,function(value,key) {
self.newLineDetails.push(value);
});
Let me know if you get any issues
