typescript - Angular Material - eliminar nodo duplicado de mat-tree
Estoy intentando crear un árbol dinámico a partir de mat-tree. Quiero eliminar todos los nodos duplicados del árbol, aquí está mi algoritmo para ello. Estoy importando datos desde Firestore y quiero que esos datos se muestren como un árbol de Material.
export class FileNode {
children: FileNode[];
filename: string;
type: any;
}
var TREE_DATA: string;
@Injectable()
export class FileDatabase {
dataChange = new BehaviorSubject<FileNode[]>([]);
cross : any[] = [];
get data(): FileNode[] {
return this.dataChange.value;
}
constructor() {
this.initialize();
}
initialize() {
// Parse the string to json object.
const dataObject = JSON.parse(TREE_DATA);
// Build the tree nodes from Json object. The result is a list of `FileNode` with nested
// file node as children.
const data = this.buildFileTree(dataObject, 0);
// Notify the change.
this.dataChange.next(data);
}
/**
* Build the file structure tree. The `value` is the Json object, or a sub-tree of a Json object.
* The return value is the list of `FileNode`.
*/
buildFileTree(obj: object, level: number): FileNode[] {
return Object.keys(obj).reduce<FileNode[]>((accumulator, key) => {
const value = obj[key];
const node = new FileNode();
node.filename = key;
if (value != null) {
if (typeof value === "object") {
node.children = this.buildFileTree(value, level + 1);
} else {
node.type = value;
}
}
return accumulator.concat(node);
}, []);
}
}
y HTML es
<mat-tree [dataSource]="nestedDataSource" [treeControl]="nestedTreeControl" class="example-tree">
<mat-tree-node *matTreeNodeDef="let node" matTreeNodeToggle>
<li class="mat-tree-node">
<button mat-icon-button disabled></button>
<mat-icon>minimize<button mat-button (click)= "itemClick(node)"> {{node.filename}}</button></mat-icon>
</li>
</mat-tree-node>
<mat-nested-tree-node *matTreeNodeDef="let node; when: hasNestedChild">
<li>
<div class="mat-tree-node">
<button mat-icon-button matTreeNodeToggle
[attr.aria-label]="'toggle ' + node.filename">
<mat-icon class="mat-icon-rtl-mirror" >
{{nestedTreeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
<mat-icon>list</mat-icon>
{{node.filename}}
</button>
</div>
<ul [class.example-tree-invisible]="!nestedTreeControl.isExpanded(node)">
<ng-container matTreeNodeOutlet></ng-container>
</ul>
</li>
</mat-nested-tree-node>
</mat-tree>
ahora TREE_DATA proviene del servicio y su valor es
Quiero crear un árbol donde todos los nodos sean únicos. He estado atascado en esto durante unos 2 días, por favor ayúdenme. Cualquier ayuda será apreciada.
