angular / angular/components

help(Tree): TreeControl selection model doesn't work for immutable data

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

説明

Please see this - https://stackoverflow.com/q/65412659/2896495.

I needed a dynamically loading nodes in the angular material tree, so I created my own `GeoDataSource` which internally uses **_@ngrx/component-store_** to handle all the interaction between data source, TreeControl and the tree itself.

Now, the problem is the tree doesn't keep its expansion state because the `abstract class BaseTreeControl` uses `SelectionModel` class and this in turn uses `Set` to keep track of items that are selected. So if node is expanded it just does this:
```
this._selection.add(value); // Set.add(value)
```

When using immutable data (from the component store) those items are always new.

I tried to use `trackBy` optional function:
```
this.treeControl = new FlatTreeControl(
(node) => node.nodeLevel,
(node) => node.expandable, {
trackBy: (node) => node.groupPath // *** groupPath is string (it's an ID) ***
}
);
```

and for this I had to change `FlatTreeControl` to `FlatTreeControl`, otherwise it doesn't compile. But then I got the following error in the **_template_**:

> Type 'FlatTreeControl' is not assignable to type 'TreeControl'

Here's the template:
```

```

Now what? How do I make all this work with immutable data from the store?

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

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

調査の方向性

まず BaseTreeControl と SelectionModel を読み、次に FlatTreeControl の trackBy ジェネリックと、mat-tree テンプレートが想定する TreeControl 型を比較します。issue にある不変データのケースを再現し、ノードを置き換えても展開状態が維持されることを確認するとともに、テンプレートの型に互換性が保たれていることを確認します。

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

評価

技術スタック
angular, typescript
領域
frontend
issue の種類
バグ
難易度
5/5
見積もり時間
1週間以上
活発さ
停滞
明瞭さ
説明が足りない
初心者へのやさしさ
25/100

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

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