Multiple ColumnHeaders

Posted by: bmakhlin on 21 August 2018, 7:44 am EST

  • Posted 21 August 2018, 7:44 am EST

    Hi,
    I how do I create multi-row column headers in the same column using ng-template? If I use ng-template below only single row column header 'row2' will be created. I want my column to be multi-row with 'row1' in the first row and 'row2' in the second row of the column header.


    row1
    row2



    <wj-flex-grid-column...
    <ng-template wjFlexGridCellTemplate [cellType]="'ColumnHeader'" let-cell="cell" >
    {{'row1 '}}
    </ng-template>
    <ng-template wjFlexGridCellTemplate [cellType]="'ColumnHeader'" let-cell="cell" >
    {{'row2 '}}
    </ng-template>
    </wj-flex-grid-column>


    thank you
  • Marked as Answer

    Replied 21 August 2018, 8:50 pm EST

    Hi,

    You cannot create multi-row column headers using wjFlexGridCellTemplate . To create multi-row column headers, you need to push new rows on grid.columnHeaders.rows collection after the grid is initialized and then you can use formatItem event to style individual header cell.

    Please refer to the following sample which implements the same:-
    https://stackblitz.com/edit/angular-qymfnv?file=src%2Fapp%2Fapp.component.ts

    ~Sharad
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels