angular / angular/components

bug(MatTree): padding is not recomputed when moving a node inside/outside an expandable node

Ouverte
#29,959 6 commentaires 1 réaction 0 personnes assignées Voir sur GitHub
area: cdk/tree area: material/tree P2
Langage dominant
TypeScript
Étoiles
25k
Forks
6.8k
Merge moyen
1 j 8 h
PR mergées (30 j)
91

Description

### 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

_No response_

### Description

As `TreeControl` is deprecated, I started migrating to the latest API using `childrenAccessor`. So far so good, except for one case not working any more.

I'm using `matTreeNodePadding` and `matTreeNodePaddingIndent` on ``. When I move a node inside/outside of an expandable node, padding is not recomputed as-is.

Expanding/collapsing the parent node in which the node was moved, will recompute its padding though.

### Reproduction

Minimal example on [Stackblitz](https://stackblitz.com/~/github.com/poirierlouis/ng-issue-29959).

Steps to reproduce:
1. Open link
2. Open preview in a new tab
3. Open both folders (`/` and `home`)
4. Follow instructions to move a node outside its parent node

`dataSource` is updated with a new array, using the same items. Can it be a source of error? Should the entire tree be cloned somehow, to trigger changes detection down to padding computation?

### Expected Behavior

When a node is moved inside/outside of an expandable node (level is changed), padding should be recomputed based on the new level of the node.

### Actual Behavior

Padding of the node is not updated when moving the node inside/outside of an expandable node.

### Environment

- Angular: 18.2.10
- CDK/Material: 18.2.11
- Browser(s): Firefox / Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Windows

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par la reproduction StackBlitz liée et examinez le comportement de matTreeNodePadding lors de l’utilisation de childrenAccessor et du déplacement d’un nœud entre des parents extensibles. Suivez la manière dont le niveau du nœud change et dont le padding est recalculé, puis vérifiez que le déplacement du nœud met à jour son padding sans développer ni réduire le parent.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
angular, typescript
Domaine
frontend
Type d'issue
Bug
Difficulté
3/5
Temps estimé
1-2 jours
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
48/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.