Search code examples
angular-material2ag-gridag-grid-ng2

Ag grid material theme row and header height not working

As suggested in documentation, i have tried below properties first.

this.gridOptions.rowHeight = 25;  
this.gridOptions.headerHeight= 28;

But it ended up like below: grid

We have also tried the material css property changes, but didnt see any reflection to the grid.

$ag-mat-grid-size: 4px;
$ag-mat-icon-size: 12px;

Please give us the suggestion here.

Solution

  • Try providing those properties at the grid itself.

     <ag-grid-angular 
       [gridOptions]="myGridOptions"
       [rowHeight]="25"          //or [rowHeight]="hightParam"
       [headerHeight]="28"       //or [headerHeight]="headerHeightParam"
  >
 </ag-grid-angular>

    I have checked it and it works.

    That's why I find kind of strange sometimes. Many of the properties they show under gridOptions under documentation, but they works only when we apply at the grid level itself. Although its performance compensates this behaviour :)

    Check this working example plunk link ag-grid material theme example