Angular Материал - удалить повторяющийся узел из дерева матов - PullRequest
Новая
       66

Angular Материал - удалить повторяющийся узел из дерева матов

0 голосов
/ 04 мая 2020

Я пытаюсь создать динамическое c дерево из mat-tree Я хочу удалить все повторяющиеся узлы из дерева, вот мой алгоритм для этого. Я импортирую данные из Firestore и хочу, чтобы эти данные отображались в виде дерева материалов 

 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);
    }, []);
  }
}

и HTML равно 

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

сейчас TREE_DATA поступает из службы и имеет значение enter image description here

Я хочу создать дерево, в котором все узлы должны быть уникальными. Я застрял на нем около 2 дней, пожалуйста, помогите. любая помощь будет оценена

...