IgxGrid 複数列ヘッダーの使い方

IgxGrid の複数列ヘッダーは、 IgxColumnGroup を定義し、その配下に IgxColumn を定義することで表示することができます。

<igx-grid #grid [primaryKey]="'ID'" [data]="data" [displayDensity]="'compact'">
  <igx-column field="ID" [width]="'100px'"></igx-column>
  <igx-column field="CompanyName" [width]="'150px'" header="CompanyName"></igx-column>
  <igx-column field="ContactName" [width]="'150px'"></igx-column>
  <!-- 複数列ヘッダー -->
  <igx-column-group header="Contact Information">
    <igx-column field="Country" [width]="'100px'"></igx-column>
    <igx-column field="Address" [width]="'200px'"></igx-column>
    <igx-column field="Phone" [width]="'150px'"></igx-column>
    <igx-column field="Fax" [width]="'150px'"></igx-column>
  </igx-column-group>
</igx-grid>