typescript1.7 - How to group data in Angular 2 ? -
how can group data in angular 2 typescript. aware done using "group by" filter in angular 1.x, not getting how group data in angular 2. have array:
import {employee} './employee'; export var employees: employee[]; employees = [ { id: 1, firstname: "john", lastname: "sonmez", department: 1, age: 24, address: "24/7, working hours apartment, cal. us", contactnumber: "+968546215789" }, { id: 2, firstname: "mark", lastname: "seaman", department: 2, age: 25, address: "32-c, happy apartments, block-9c, cal. us", contactnumber: "+968754216984" }, { id: 3, firstname: "jamie", lastname: "king", department: 3, age: 32, address: "54/ii, glorydale apartment, cal. us", contactnumber: "+967421896326" }, { id: 5, firstname: "jacob", lastname: "ridley", department: 5, age: 24, address: "24/7, working hours apartment, cal. us", contactnumber: "+968546215789" }, { id: 6, firstname: "peter", lastname: "parker", department: 3, age: 25, address: "32-c, happy apartments, block-9c, cal. us", contactnumber: "+968754216984" }, { id: 7, firstname: "martin", lastname: "luther", department: 4, age: 32, address: "54/ii, glorydale apartment, cal. us", contactnumber: "+967421896326" }, { id: 8, firstname: "raghav", lastname: "kumar", department: 1, age: 34, address: "51/c shivalik, cal. us", contactnumber: "+967842569842" }, { id: 9, firstname: "narayan", lastname: "sonmez", department: 3, age: 24, address: "24/7, working hours apartment, cal. us", contactnumber: "+968546215789" }, { id: 10, firstname: "russell", lastname: "andre", department: 2, age: 25, address: "32-c, happy apartments, block-9c, cal. us", contactnumber: "+968754216984" }, { id: 11, firstname: "ramona", lastname: "king", department: 4, age: 32, address: "54/ii, glorydale apartment, cal. us", contactnumber: "+967421896326" }, { id: 12, firstname: "andre", lastname: "russell", department: 1, age: 34, address: "51/c shivalik, cal. us", contactnumber: "+967842569842" }, { id: 13, firstname: "nathan", lastname: "leon", department: 1, age: 24, address: "24/7, working hours apartment, cal. us", contactnumber: "+968546215789" }, { id: 14, firstname: "brett", lastname: "lee", department: 5, age: 25, address: "32-c, happy apartments, block-9c, cal. us", contactnumber: "+968754216984" }, { id: 15, firstname: "tim", lastname: "cook", department: 2, age: 32, address: "54/ii, glorydale apartment, cal. us", contactnumber: "+967421896326" }, { id: 16, firstname: "steve", lastname: "jobs", department: 5, age: 34, address: "51/c shivalik, cal. us", contactnumber: "+967842569842" } ];
and looking count employees department, like
department 1 has 4 employees
and on.
joining department id actual department (so can department name) story need figure out.
thanks in advance kinds of help.
you can use custom pipe described below:
@pipe({name: 'groupby'}) export class groupbypipe implements pipetransform { transform(value: array<any>, field: string): array<any> { const groupedobj = value.reduce((prev, cur)=> { if(!prev[cur[field]]) { prev[cur[field]] = [cur]; } else { prev[cur[field]].push(cur); } return prev; }, {}); return object.keys(groupedobj).map(key => ({ key, value: groupedobj[key] })); } }
and on template can write:
<div *ngfor="let item of employees | groupby:'department'"> department {{ item.key }} has {{ item.value.length }} employees </div>
see corresponding plunker https://plnkr.co/edit/clnlh13ih4wasurdol4n?p=preview
hope helps you!
Comments
Post a Comment