angular / angular/components

(bug)[Mat-Tree] - Problematic behavior when combining dynamic data with trackby

オープン
#15,015 コメント 4 件 リアクション 10 件 担当者 0 名 GitHub で見る
area: material/tree P4 perf
主要言語
TypeScript
スター
25k
フォーク
6.8k
平均マージ
1日 8時間
マージ済み PR(30日)
91

説明

#### What is the expected behavior?
There should be a way to be able to dynamically update leaf nodes within a tree without forcing a collapse upon the tree.

#### What is the current behavior?
Utilizing a `trackBy` function to track an individual node by something like an ID causes the entire tree to become unresponsive after a change is made to the data. When the `trackBy` is omitted, the tree continues to respond after data changes, but any open nodes will collapse and you will have to re-navigate to the previously opened node.

#### What are the steps to reproduce?
Please reference the following stackblitz. Clicking the 'new' button will cause a new leaf to be created under node ID 1. Once this happens, you will see that all nodes will collapse, and clicking on the chevron will not prompt them to open. If you navigate to the template for the controller, and remove the `trackBy` function from the `mat-tree` element, you will find that upon clicking 'new' the tree will continue to collapse, but you will be able to re-expand individual nodes and see the new leaf.

https://stackblitz.com/edit/angular-afy2h1

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

リンクされた StackBlitz の再現コードから始め、動的なリーフ更新と trackBy 関数に関係する mat-tree テンプレートおよびコントローラーを調べてください。trackBy の有無それぞれで問題を再現し、その後、ツリーの更新動作を追跡してください。リーフを追加してもツリーの応答性が維持され、ノードを展開できることが完了の条件です。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
angular, typescript
領域
frontend
issue の種類
バグ
難易度
4/5
見積もり時間
3〜5日
活発さ
停滞
明瞭さ
おおむね明確
初心者へのやさしさ
35/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。