RTL support for ag-grid

Question

I am using ag-grid 22.2.1 with angular12. And trying enableRtl feature. I am not able to make it work. CSS (even JS) seems to be broken.

<ag-grid-angular
    [columnDefs]="columnDefs"
    style="height: 100%;"
    class="ag-theme-blue"
    [rowData]="data"
    [enableRtl]="true"
    [modules]="modules"
  >
  </ag-grid-angular>

Answer 1

It looks like this was a bug in v22, I looked back to find the version that it was fixed in, looks like from v25 onwards it was fixed based on the changelog

You can verify this here (v25)

<ag-grid-angular
    #agGrid
    style="width: 100%; height: 100%;"
    id="myGrid"
    class="ag-theme-alpine"
    [columnDefs]="columnDefs"
    [defaultColDef]="defaultColDef"
    [enableRangeSelection]="true"
    [rowData]="rowData"
    [enableRtl]="true"
    (gridReady)="onGridReady($event)"
  ></ag-grid-angular>

I'd recommend upgrading to the latest version (v27), but if that's not possible then v25.3.0 should also work for you.