Thanks to visit codestin.com
Credit goes to github.com

Skip to content

bug(mat-tree): How to maintain tree expansion state if TreeControl is deprecated? #30258

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
1 task done
danielsharvey opened this issue Jan 1, 2025 · 4 comments
Open
1 task done

bug(mat-tree): How to maintain tree expansion state if TreeControl is deprecated? #30258

danielsharvey opened this issue Jan 1, 2025 · 4 comments
Labels
area: cdk/tree P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@danielsharvey
Copy link

Is this a regression?

  • Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

pre v18.2.0

Description

Previously, it was possible to maintain the expansion state independent of the MatTree (rendered) component by using a TreeControl.

With TreeControl deprecated, this does not appear possible any longer.

I rely on this feature so would appreciate consideration of a path forward.

Of note, the selection model is maintained privately in MatTree:

components/src/cdk/tree/tree.ts

Lines 366 to 372 in b961966

_getExpansionModel() {
if (!this.treeControl) {
this._expansionModel ??= new SelectionModel<K>(true);
return this._expansionModel;
}
return this.treeControl.expansionModel;
}

Note that this is not a duplicate of #29856, which looks to relate to accessing some of the methods of TreeControl, which have been made available on MatTree itself.

Reproduction

I can produce a reproduction but I believe the regression has been clearly explained above and a reproduction does not add value.

Expected Behavior

There is a mechanism for maintaining expansion state independent of the rendered component.

Actual Behavior

Expansion state is lost when the component is destroyed.

Environment

Angular CLI: 18.0.3
Node: 18.20.5
Package Manager: npm 10.8.2
OS: darwin arm64

Angular: 18.0.2
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1800.3
@angular-devkit/build-angular     18.0.3
@angular-devkit/core              18.0.3
@angular-devkit/schematics        18.0.3
@angular/cdk                      18.2.14
@angular/cli                      18.0.3
@angular/flex-layout              14.0.0-beta.41
@angular/material                 18.2.14
@angular/material-luxon-adapter   18.2.14
@schematics/angular               18.0.3
ng-packagr                        18.0.0
rxjs                              7.8.1
typescript                        5.4.5
zone.js                           0.14.4
@danielsharvey danielsharvey added the needs triage This issue needs to be triaged by the team label Jan 1, 2025
@Sebi11
Copy link

Sebi11 commented Jan 15, 2025 •
edited
Loading

I agree!
#29856 (comment) with ViewChild might be a solution, but we must wait for the MatTree component to be rendered before calling methods on it.

@WwwHhhYran
Copy link

I agree! #29856 (comment) with ViewChild might be a solution, but we must wait for the MatTree component to be rendered before calling methods on it.

That's true πŸ‘, but I feel that deprecating TreeControl has made the control of trees even more complex.

@WwwHhhYran
Copy link

Execuse, any one can address this issue ? @crisbeto @andrewseguin @@BobobUnicorn

I think the original TreeControl was able to ensure the isolation of the view from the model, which made it easier for us to manage the data and the state of the tree. But nowadays it's only possible to manage it through tree instances which is obviously not convenient. Let me give you an example:

In the old version (before v 18.2.0), I would pass only some of the data to be rendered to the tree view, and all the data to the Tree Control, and I could manage the nodes through the tree control's expansionModel. if I need to expand some other nodes, I can do it through the tree control's expand method and combine node isExpanded status to pass the certain node data to the tree.

But now, if I use levelAccessor property, I have to pass all the data to the tree, and then use style.display combined with the shouldRender method to hide some nodes that shouldn't be shown, like the official demo. If I don't pass all the data to the tree, it may cause methods like expandAll, expandDescendants, etc. to be incorrect. I dont think this is an elegant approach, and this approach may lead to inconvenient use。

@crisbeto crisbeto added P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent area: cdk/tree and removed needs triage This issue needs to be triaged by the team labels Apr 29, 2025
@tutkli
Copy link

tutkli commented May 14, 2025

Before I used TreeControl to mix virtual scrolling with a tree. Similar to this example, but with the deprecation of these classes it would be impossible in the future. Rendering huge trees will be very expensive performance wise.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
area: cdk/tree P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@crisbeto @danielsharvey @Sebi11 @tutkli @WwwHhhYran