Refresh Grid Columns After Data Change

[Brandon]

I am unsure how to do this and correctly update the columns on the grid. 

To sum up my use case the below is a very simple example of what I am trying to do. 

Grid is initialized on page load with data source 1, data source 1 has columns A, B, C, D. Grid correctly shows columns ABCD. The user now wants to view a different data set by selecting a series of drop downs on the page. Updating the data source to data source 2 with columns B, D, E, F. The grid now incorrectly shows columns ABCD.

 

Is there a way to refresh the grid in Angular 2+ after a data source change that will reset columns from the data source?

[Brandon]

https://plnkr.co/edit/GGblDfUqETpBALuNlRAL?p=preview

 

Adding a plunker to better show the example above. 

[Nikolay Rusev]

Hello,

Auto-generated column will no be refreshed automatically when changing the shape of the data items. In order to refresh them, you will need to "reset" the columns collection.

Bellow is updated example demonstrating this approach.

https://plnkr.co/edit/htk7JcHcWn4Vq8ok4T8l?p=preview

Regards,
Nikolay Rusev
Progress Telerik

[congdongdientu.]

I have a problem after reset the grid columns, the img element will be die

[Georgi]

Hello,

Thank you for reaching out to us.

From the attached screenshots, I can see that something is indeed going wrong, but unfortunately I am unable to reproduce the issue and start an investigation.

Would you be able to send us all the necessary pieces of code which are sufficient to reproduce the issue? You could send them as text and that would be fine, but a working stackblitz demo will make it easier and quicker for us to start troubleshooting.

Looking forward to hearing from you.

Regards,
Georgi
Progress Telerik