Mat-tree :Tree with nested nodes adding child doesnt update the view.

[juggernut]

Bug:

When using mat-nested-tree-node with a nested datasource if you add a child to an existing parent it does not update the view.

What is the expected behavior?

Well if you change or add a child to an existing parent in the nestedDataSource it should update the tree.

What is the current behavior?

It does not update the view when adding a child to an existing parent to the nestedDataStructure .

What is the use-case or motivation for changing an existing behavior?

Well in my case i need to update the view since i add/delete nodes .

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

versions 6 (Chrome ver 66)

Is there anything else we should know?

I found an workaround: refreshTree(){ let _data = this.nestedDataSource.data; this.nestedDataSource.data = null; this.nestedDataSource.data = _data; }

[joelcoxokc]

Hello folks,

I would like to remind everyone that Angular has a Code of Conduct.

Anyone gonna fix something as stupid simple as this?

Let's try to keep the tone professional, so that everyone can feel comfortable participating in this open source project.

Best Regards,

Zach

I apologize for my unprofessional tone here. Please forgive me as I am a huge fan of the angular team. Though I am still surprised by a six year bug..

I updated my comment

[joelcoxokc]

Hey this started popping up in my notifications. Passing along a public gist of pipe that I created to get around this one: https://gist.github.com/CharlieGreenman/5352cec2424f9f20d11d48a5de27d8ac

Can then do something like

<-- HTML file --> 
<cdk-tree
      [dataSource]="tree"
      [treeControl]="treeControl"
      [trackBy]="( [ 'id', 'level', 'name'] | trackByProperty )"

// ts file 
treeControl = new FlatTreeControl<any>(
    (node) => node.level,
    (node) => node.expandable
  );

This will help the performance aspect and can then make the cdk-tree immutable without suffering performance issues. Happy coding

Will this work in nested trees?

[CharlieGreenman]

Hey this started popping up in my notifications. Passing along a public gist of pipe that I created to get around this one: https://gist.github.com/CharlieGreenman/5352cec2424f9f20d11d48a5de27d8ac Can then do something like

<-- HTML file --> 
<cdk-tree
      [dataSource]="tree"
      [treeControl]="treeControl"
      [trackBy]="( [ 'id', 'level', 'name'] | trackByProperty )"

// ts file 
treeControl = new FlatTreeControl<any>(
    (node) => node.level,
    (node) => node.expandable
  );

This will help the performance aspect and can then make the cdk-tree immutable without suffering performance issues. Happy coding

Will this work in nested trees?

Nested data for trees in general, unless purely presentational is non ideal(speaking from personal experience). Will have to loop through data every time want to add, delete, update, batch actions etc), instead of just going for the id looking for. The recommendation here is to make flat data first(via use of level incremets e.g. level 0, level 1, level 2 etc) and then pipe into cdk-tree. You will have a much better time with this architecture.

I can pass along some code to turn it into a flat tree, but in general when working with file trees, you want flat data

[zarend]

Hello,

Thanks for participating and sharing work-around and thoughtful questions. Other developers often find that kind of stuff helpful.

I don't know off the to of my head if that will work in nested trees. The Angular team can give a limited amount of support in this issue tracker. If you don't get an answer, you may have more luck in our various support channels.

• StackOverflow
• create a Github dicussion
• angular-material2 Google group
• Angular gitter

We've noticed that Tree has fallen behind some of our other components, we have been working for a few months on making improvements to Tree component. A contributor outside of the Angular team has initiated this improvement. See #27626.

This is a large change, so it could take some time for it to finish. We don't have a date planed, but I'm expecting it to land Q1 of this year.

Best Regards,

Zach

[jviaches]

Still same workarounds.. Any updates on fix ?

[alcaidio]

Hello do imuttable changes and table will be update. But it collapse all after change :/ maybe i need to keep expanded state?