ng2-drag-drop-tree: Adding a new node and demo available!

One very important feature wasn't listed yet, the possibility to add some nodes!

Let's do this!

First we will add a very beautiful icon in the tree-node.html:

< span (click) = ' addNewNode(child) ' > + </ span >

In tree-node.component we create the function addNewNode. Very simple, using the spread operator we recreate the subNodes of the node that we passed and push at the end a new node that is created using the TreeManager Service:

addNewNode ( node ) { node . subNodes = [ . . . node . subNodes , this . treeManager . getNewNode ( ) ] ; }

For now in the TreeManager Service, we return a simple node.

getNewNode ( ) { return { text : 'new node' , subNodes : [ ] , expanded : false } ; }

And the work is done!

I appreciate your feedback, one of them was about creating a demo. The project is still in an early stage and didn't think you would need it yet!

So you can git clone the demo from here!

I encountered an irregularity in the Primeng when I tried to do a stopPropagation (for dropping an arborescence of nodes) and opened an issue on their website. Since there are lot of issues there, it will take some time. I will certainly fork it for the need of the project.

Stay tuned for the next episodes!