javascript - 无法在初始化时使用angular2-tree选择树中的所有复选框

目标:我有一个名为“feed data”的按钮，因此，每当我单击它时，数据都将被加载，这意味着带有复选框的树在这里，我的要求是，当我将其与数据一起单击时，必须在init上选中所有复选框我尝试使用

 this.treeComp.treeModel.doForAll((node: TreeNode) => node.setIsSelected(true));

但它不能正常工作是我的代码

 click(tree: TreeModel) {

    this.arrayData = [];

    let result: any = {};
    let rs = [];

    console.log(tree.selectedLeafNodeIds);





    Object.keys(tree.selectedLeafNodeIds).forEach(x => {


      let node: TreeNode = tree.getNodeById(x);
      // console.log(node);


      if (node.isSelected) {

        if (node.parent.data.name) //if the node has parent
        {
          rs.push(node.parent.data.name + '.' + node.data.name);
          if (!result[node.parent.data.name]) //If the parent is not in the object
            result[node.parent.data.name] = {} //create
          result[node.parent.data.name][node.data.name] = true;

        }
        else {
          if (!result[node.data.name]) //If the node is not in the object
            result[node.data.name] = {} //create
          rs.push(node.data.name);
        }


      }
    })
    this.arrayData = rs;
    tree.selectedLeafNodeIds = {};

  }

  selectAllNodes() {
    this.treeComp.treeModel.doForAll((node: TreeNode) => node.setIsSelected(true));
    //  firstNode.setIsSelected(true);

  }

  onTreeLoad(){
    console.log('tree');
  }



  feedData() {

    const results = Object.keys(this.data.info).map(k => ({
      name: k,
      children: this.data.info[k].properties
        ? Object.keys(this.data.info[k].properties).map(kk => ({ name: kk }))
        : []

    }));

    this.nodes = results;





  }

  feedAnother() {



    const results = Object.keys(this.dataa.info).map(k => ({
      name: k,
      children: this.dataa.info[k].properties
        ? Object.keys(this.dataa.info[k].properties).map(kk => ({ name: kk }))
        : []
    }));
    this.nodes = results;


  }

  onActivate(event) {
    this.selectedDataList.push(event.node.data);
    console.log(this.selectedDataList)
  }

  onDeactivate(event) {
    const index = this.selectedDataList.indexOf(event.node.data);
    this.selectedDataList.splice(index, 1);
    console.log(this.selectedDataList)
  }

以下是我的stackblitz https://stackblitz.com/edit/angular-hrbppy

最佳答案

只是，在函数供稿数据调用中，函数set.out中包含了this.selectAllNodes()。您可以看到自己的forked stackblitz

setTimeout(()=>{
   this.selectAllNodes()
})

注意:我在您的代码中看到您尝试以不同的方式控制所选项目。我简化了使用递归函数。

在this.treeComp.treeModel.selectedLeafNodeIds中，我们有更改的项目，因此

  getAllChecked()
  {
    const itemsChecked=this.getData(
              this.treeComp.treeModel.selectedLeafNodeIds,null)
    console.log(itemsChecked);
  }

  getData(nodesChanged,nodes) {
    nodes=nodes||this.treeComp.treeModel.nodes
    let data: any[] = []
      nodes.forEach((node: any) => {
        //in nodesChanged we has object like {1200002:true,123132321:false...}
        if (nodesChanged[node.id]) //can be not changed, and then it's null because
                           //it's not in object or can be changed to false
          data.push({id:node.id,name:node.name})
          //or data.push(node.name); //if only need the "name"
          if (node.children)
              data=[...data,...this.getData(nodesChanged,node.children)]
      }
      );
    return data
  }

更新了我更新了getData函数以包括节点的“父级”，但是查找@Raghul selvam的代码，他的功能比我更像我。

getData(nodesChanged,nodes,prefix) {
    nodes=nodes||this.treeComp.treeModel.nodes
    let data: any[] = []
      nodes.forEach((node: any) => {
        if (nodesChanged[node.id])
          data.push(prefix?prefix+"."+node.name:node.name)
          if (node.children)
              data=[...data,...this.getData(nodesChanged,node.children,prefix?prefix+"."+node.name:node.name)]
      }
      );
    return data
  }

并称其为

this.getData(this.treeComp.treeModel.selectedLeafNodeIds,null,"")

关于javascript - 无法在初始化时使用angular2-tree选择树中的所有复选框，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/56447524/