Unable to retrieve custom data from node in TreeView

I am unable to retrieve routerLink in onNodeSelected.How can I pass custom data ?Hereis the result of the console log.
  1. nodeData:
    1. expanded: false
    2. hasChildren: false
    3. id: "01"
    4. isChecked: null
    5. parentID: null
    6. selectable: true
    7. selected: true
    8. text: "Estimation"



public data:{[key:string]:Object}[]=[
  {
    nodeId:'01', nodeText:'Estimation', iconCss:'e-icons e-list-ordered', routerLink:'/estimations'
  }
];

public fields:object={ dataSource:this.data, id:'nodeId', text:'nodeText', iconCss:"iconCss"};

async onNodeSelected(args: any):Promise<void>{
   console.log(args);
   const selectedNode = args?.nodeData;
   const routerLink = selectedNode?.routerLink;
   if(!routerLink){
     return;
   }
   await this.router.navigate([routerLink]);
}

1 Reply

LD LeoLavanya Dhanaraj Syncfusion Team March 25, 2025 09:54 AM UTC

Hi Dufour,


Greetings from Syncfusion support.


From the shared details, we understand that you want to get additional attributes value of the treenode in the TreeView component. You can access the additional attributes of the corresponding tree node by utilizing the getTreeData method and passing its id attribute. We have provided a TreeView sample that demonstrates how to retrieve the tree node based on its corresponding selected value by using the id in the getTreeData  method within the nodeSelected event.


Sample : Whjkcewc (forked) - StackBlitz


[app.component.html]

<ejs-treeview 

  id="listtree"

  #tree

  [fields]="listfields"

  allowDragAndDrop="true"

  (nodeSelected)="onNodeSelected($event)"

></ejs-treeview>

 

[app.component.ts]

public localData: Object[] = [

  { id: 1, name: 'Discover Music', hasChild: true, expanded: true },

  {

    id: 2,

    pid: 1,

    name: 'Hot Singles',

    routerLink: '/estimations',

  } …

];

@ViewChild('tree') treeObj;

onNodeSelected(args) {

  console.log(this.treeObj.getTreeData(args.nodeData.id));

}


Please check the attached sample and get back to us if you need any further assistance.


Regards,

Leo Lavanya Dhanaraj


Loader.
Up arrow icon