title: How to specify a link or function to each angular tree-root node's children?
body: <p>How do I specify a link or function to each angular tree-root node's children?</p>
  
  <p>Example of .html</p>
  
  <pre><code>&lt;!-- edited after advise from @SachilaRanawaka, 
   somehow (onToggle) is not having any reactions
   but (click) has--&gt;
  
  &lt;tree-root #tree [nodes]="nodes" (click)="handleEvent($event)"&gt;&lt;/tree-root&gt;
  </code></pre>
  
  <p>Example of .ts</p>
  
  <pre><code>nodes = [{id:1,name:"parent",children:[{id:2,name:"children1"},
                                         {id:3,name:"children2"}]
          }];
  
  // edited after advise from @SachilaRanawaka
  handleEvent(event){
     alert(event.eventName);
  }
  </code></pre>
  
  <p>How do I specify a link (e.g. <em>a href</em>? <em>router</em>?) or function to run on clicking children1 or children2? </p>
  
  <p>Is there a property for it? </p>
  
  <p>Something along the line of this:</p>
  
  <pre><code>nodes = [{id:1,name:"parent",children:[
                                   {id:2,name:"children1", link:"/test/children1.html" },                                           
                                   {id:3,name:"children2", link:"/test/children2.html" }
                               ]
           }];
  </code></pre>
  
  <p>Here's a link regarding the kind of tree i'm using : <a href="https://angular2-tree.readme.io/" rel="nofollow noreferrer">Angular 2 Tree</a></p>