I have difficulties to align the first line of a double-line header in ag-grid. The grid is configured as:
<ag-grid-angular
id="data_grid"
class="ag-theme-alpine ag-theme-material ag-center-aligned-header"
style="width: 2800px; height: 800px; margin-right: 1%; float: left; font-size: 16px !important"
(gridReady)="onDailyGridReady($event)"
[rowData]="row_data"
[columnDefs]="column_defs"
[gridOptions]="grid_options">
</ag-grid-angular>
Then in the ts file:
column_defs = [
{
headerName: 'A',
'headerClass': "ag-right-aligned-header",
children: [
{ headerName: 'A1', field, 'A1', ..., 'headerClass': "ag-right-aligned-header", 'cellClass': 'ag-right-aligned-cell'
},
...
]
},
{
headerName: 'B',
'headerClass': "ag-center-aligned-header",
children: [
...
]
}
]
The problem I am having is the alignment I put in for the first line header (‘A’, ‘B’) does not work. The first line always aligned to left. What am I missing?