how do enable sorting in an angular ag grid

4.6k views Asked by At

Im trying to add sorting to a simple ag grid but i keep getting an error saying : Can't bind to 'enableSorting' since it isn't a known property of 'ag-grid-angular'.

Here is the template:

<ag-grid-angular
 [enableSorting]="true"
 [rowData]="rowData"
 [columnDefs]="columnDefs"
>
</ag-grid-angular>

i even tried using a GridOptions object but it wont recognize enableSorting or enableFilter but it does recognize pagination. what am i doing wrong?

I'm following this introductory guide on ag grid's blog. without the sorting part the grid works as expected so i dont think its something related to configuration(imported module and import array) but i double checked anyway and its all setup correctly! angular version 10 ag grid version 24.

3

There are 3 answers

3
cmprogram On BEST ANSWER

I personally would recommend using GridOptions again - as it's likely you'll want to specify how many other parts of Ag-Grid look and feel.

If you'd like sorting to be available on all of the columns in your grid, simply use the following:

gridOptions: GridOptions = {
  defaultColDef: {
    sortable: true
  }
}

And then provide grid options to your Ag-Grid in the html:

<ag-grid-angular
 [gridOptions]="gridOptions"
 [rowData]="rowData"
 [columnDefs]="columnDefs"
>
</ag-grid-angular>
1
achref akrouti On

try like this..

gridOptions: {
 
    defaultColDef: {
        sortable: true
    },
    columnDefs: [
        { field: 'name' },
        { field: 'age' },
     
        { field: 'address', sortable: false },
    ]
}



    <ag-grid-angular
            [rowData]="rowData | async"
            [columnDefs]="columnDefs"
            [enableSorting]="true"
        >
        </ag-grid-angular>
0
risingTide On

I ran into this problem while upgrading from ag-grid 19 to 24. It appears that since version 20 enableFilter has been removed at the GridOptions level and must be set per ColDef. See here for more on that.

And although I couldn't find any similar documentation on it, I suspect the same thing has happened with enableSorting. It seems it was thus replaced with sortable at the ColDef level as @cmprogram mentioned in his/her answer.

This is speculation, but if anyone can find the documentation on that change please respond in the comments and I'll add it to this answer.