Angular-дерево-компонент, как захватить выбранные узлы с помощью выбора флажка - PullRequest
0 голосов
/ 01 мая 2018

Я использую angular-tree-component для генерации дерева с опциями флажков. HTML

<tree-root [nodes]="nodes" [options]="options">
      </tree-root>

Машинопись:

import { ITreeOptions } from 'angular-tree-component';
import { Component } from '@angular/core';

export class myComponent {
nodes = [
    {
      name: 'root1',
      children: [
        { name: 'root1_child1' },
        {
          name: 'root1_child2', children: [
            { name: 'grand_child1' },
            { name: 'grand_child2' }
          ]
        }
      ]
    },
    {
      name: 'root2',
      children: [
        { name: 'root2_child1' },
        {
          name: 'root2_child2', children: [
            { name: 'grand_child1' },
            { name: 'grand_child2' }
          ]
        }
      ]
    }
  ];

  options: ITreeOptions = {
    useCheckbox: true
  };

  optionsDisabled: ITreeOptions = {
    useCheckbox: true,
    useTriState: false
  };

Таким образом, я могу выбрать узлы дерева (включая дочерние), но не могу найти способ, где я могу захватить все выбранные (отмеченные) узлы и отобразить в другом окне. enter image description here

Ответы [ 2 ]

0 голосов
/ 05 апреля 2019

При ссылке на ответ выше, чтобы получить объекты, вы можете использовать

  Object.entries(this.treeModel.selectedLeafNodeIds)
  .filter(([key, value]) => {
    return (value === true);
  })
  .map((id) => {
    let node = this.treeModel.getNodeById(id[0]);
    return node;
  });
0 голосов
/ 24 мая 2018

Вы можете использовать "event.treeModel.selectedLeafNodeIds", чтобы получить выбранный узел в дереве,

Пример:

<tree-root [nodes]="treeNode" (select)="onSelect($event)"
    (deselect)="onDeselect($event)" [options]="options"></tree-root>

this.selectedTreeList = Object.entries(event.treeModel.selectedLeafNodeIds)
     .filter(([key, value]) => {
            return (value === true);
      }).map((node) => node[0]);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...