Angular 2 pipe - calculating summary of array of objects

Question

I have list of objects with balances (there are other properties in objects but not imported for example):

[{ balance : 100 },{ balance : 200 },{ balance : null },{ balance : 300 }]

I am looking for smart pipe that would sum (other would average) balances in array (would prefer not using for loop - but some ES6 functionality like reduce but not sure how)

Christopher Moore · Accepted Answer · 2017-02-10 17:55:02Z

26

You will need to write your own pipe, below should give you what you are after. It takes the attribute of the object you want to sum as a parameter

Sum

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
    name: 'sum'
})
export class SumPipe implements PipeTransform {
    transform(items: any[], attr: string): any {
        return items.reduce((a, b) => a + b[attr], 0);
    }
}

Use it how you would any other pipe

<span>{{ balances | sum:'balances' }}</span>

Average

For an average pipe, just use the similar logic as the sum pipe. This treats null as 0.

transform(items: any, attr: string): any {
    let sum = items.reduce((a, b) => a + b[attr], 0);
    return sum / items.length;
}

edited Feb 10, 2017 at 17:55

answered Feb 10, 2017 at 17:10

Christopher Moore

3,0995 gold badges33 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

aplon Over a year ago

Thanks for a great solution. I expanded it to include flat arrays (without the attribute), like so: if (attr) { sum = items.reduce((a, b) => a + b[attr], 0); } else { sum = items.reduce((a, b) => a + b, 0); }

Collectives™ on Stack Overflow

Angular 2 pipe - calculating summary of array of objects

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related