Angular-tree-component: How to add node/nodes as a child or root programatically

Created on 3 Jan 2018 · 4Comments · Source: CirclonGroup/angular-tree-component

`

{{ node.data.name }}

        <a *ngIf="!checked">
          <i class="fa fa-pencil" aria-hidden="true"></i>
        </a>

      </ng-template>
    </tree-root>`

addNode calls a dialog. User enters data and then I have to update the tree. addNode can be clicked against any node and data entered by user would be the child node.

What shall i do next . I am new to angular

Source

salilbajaj

Most helpful comment

Hi.. After you enter data in the dialog... You must have to push node in tree..

addNode(evaluationMapper, node, tree):void { 
// other logic here..
// modelNode from dialog data
let modelNode = {'id':'idNode','name':'example','descripcion':'example'}
    if (node.data.children) {
      node.data.children.push(modelNode);
      tree.treeModel.update();
    } else {
      node.data.children = [];
      node.data.children.push(modelNode);
      tree.treeModel.update();
    }
};

LuisReinoso on 5 Jan 2018

👍6 👀1

All 4 comments

Hi.. After you enter data in the dialog... You must have to push node in tree..

addNode(evaluationMapper, node, tree):void { 
// other logic here..
// modelNode from dialog data
let modelNode = {'id':'idNode','name':'example','descripcion':'example'}
    if (node.data.children) {
      node.data.children.push(modelNode);
      tree.treeModel.update();
    } else {
      node.data.children = [];
      node.data.children.push(modelNode);
      tree.treeModel.update();
    }
};

LuisReinoso on 5 Jan 2018

👍6 👀1

Closing this issue due to inactivity. Please open a new issue if the problem still exists.

tobiasengelhardt on 6 Jul 2020

I used this code , it's work

addNode(parent: TreeNode) {
this.tree.treeModel.setFocus(true);
const value = {
name: 'a new child',
children: []
};
if (parent) {
parent.data.children.push(value);
}
this.tree.treeModel.update();
}