データを角度2でグループ化する方法は？

Question

Type 2でデータをグループ化するにはどうすればいいですか？私は、これは角度1.Xでフィルタ「によりグループ」を使用して行われることを承知していますが、私はこの配列持っているかに角2のグループのデータを取得していない：

import {Employee} from './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" } 
     ]; 

と私は従業員をカウントするために探していますが部署によって、

部門のように1は、4人の従業員

などがあります。

実際の部門と部門IDを結合することで（部門名を得ることができます）、私が把握する必要がある別の話です。

Answer 1

あなたは、以下のようにそれを行うためにcustom pipeを使用することができます。

@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] })); 
    } 
} 

そして、テンプレート上のあなたが書くことができます。

<div *ngFor="let item of employees | groupBy:'department'"> 
    Department {{ item.key }} has {{ item.value.length }} employees 
</div> 

も参照plunker https://plnkr.co/edit/cLnlH13IH4WAsuRdol4n?p=preview

希望に対応それはあなたを助ける！

Answer 2

を使用できNGX-パイプ返信用https://github.com/danrevah/ngx-pipes#groupby

this.arrayObject = [ 
 
    {id: 1, elm: 'foo', value: 0}, 
 
    {id: 2, elm: 'bar', value: 1}, 
 
    {id: 3, elm: 'foo', value: 2}, 
 
    {id: 4, elm: 'foo', value: 2} 
 
]; 
 

 
this.arrayNestedObject = [ 
 
    {id: 1, prop: { deep: 'foo' }}, 
 
    {id: 2, prop: { deep: 'bar' }}, 
 
    {id: 3, prop: { deep: 'foo' }}, 
 
    {id: 4, prop: { deep: 'bar' }} 
 
];

<p>{{ arrayObject | groupBy: 'elm' }}</p> 
 
<!-- Output: "{foo: [{id: 1, elm: 'foo', value: 0}, {id: 3, elm: 'foo', value: 2}, {id: 4, elm: 'foo', value: 2}], bar: [{id: 2, elm: 'bar', value: 1}]}" -->