Kendo UI grid for Angular dynamic reordering columns

Question

I have a Kendo UI for Angular no Kendo for JQuery and I have been try to look how to reorder columns dynamically. The API allows reorder by enable it like this:

<kendo-grid [reorderable]="true"...../>

But I want tp be able to reorder columns in my code. So far the solution I was doing is having different templates for the grid and change those template but that is very cumbersome. Is there a way or work around to reorder columns dynamically for this new Kendo UI grid for Angular I did not see any in the API

Makla Makla · Accepted Answer · 2018-02-27T15:48:52

I am not sure how your columns are defined, but I had same problem. Lucky for me, I set my columns with ngFor. Then I just order array of columns:

<kendo-grid-column *ngFor="let column of info?.columns"
                               [field]="column.field"
                               [title]="column.title | translate"
                               [format]="column.format"
                               [filter]="column.filter"
                               [editor]="column.editor"
                               [width]="column.width"
                               [editable]="column.isPrimary"
                               [hidden]="isColumnHidden(column)">

Some times ago I ask to implement feature for reading order(not writing). Details are here. Maybe requesting 2-way binding for order property would be the best. Both problems gone.

Kendo UI grid for Angular dynamic reordering columns

1 Answers