angular / angular/components

bug(cdk-tree): CDK Tree can't be opened when trackBy function is used after update of datasource

Offen
#30,403 9 Kommentare 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen
area: cdk/tree P2
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

### Is this a regression?

- [x] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

Angular 17 (here is the same example: https://stackblitz.com/edit/zmfrj6ks?file=src%2Fexample%2Fcdk-tree-nested-example.ts,src%2Fexample%2Fcdk-tree-nested-example.html with Angular 17)

### Description

Hi, there is a bug in the Angular CDK Tree. When you update the data of the tree and a trackBy function is given to the tree, you can't interact with the tree anymore.

### Reproduction

StackBlitz link: https://stackblitz.com/edit/fesfbplt?file=src%2Fexample%2Fcdk-tree-nested-children-accessor-example.html
Steps to reproduce:
1. interact with the tree (not mandatory, but you see that it works)
2. click on "changeTree" button
3. try to open the tree again => this doesn't work

### Expected Behavior

Tree should be updateable and interactive after an update. I would also expect that the open state is kept when only part of the tree is changed (in the example one subtree is removed, the other persists) and a trackby function is given.

### Actual Behavior

Tree is closed and not interactive anymore.

### Environment

- Angular: 18/19
- CDK/Material: 18/19
- Browser(s): all
- Operating System (e.g. Windows, macOS, Ubuntu): windows

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne mit der verknüpften StackBlitz-Reproduktion und dem Verhalten von Angular CDK Tree rund um seine trackBy-Funktion und Aktualisierungen der datasource. Reproduziere die changeTree-Sequenz und verfolge anschließend die CDK Tree-Einstiegspunkte, die an der Aktualisierung der Daten und der Beibehaltung des Interaktionszustands beteiligt sind. Erledigt ist die Aufgabe, wenn der Baum nach einer Aktualisierung interaktiv bleibt und den geöffneten Zustand unveränderter Teilbäume beibehält.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
frontend
Issue-Typ
Bug
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.