How To add Icon In parent child and sub child node?

Question

My tree view Actual Need to like this

Mithun Pradhan · Answer

Solved ---------------------- ${Name} ")"> public async Task OnGetAsync() { FruitsListViewModel= await _userService.GetFruitsListAsync(Id); TreeViewModel = new List (); foreach (var data in FruitsListViewModel) { var treeViewNode = new { data.Id, data.parentId, data.Name, HasChild = data.FruitsCategory!= 3, Expanded = !data.IsDefault, data.IsDefault, Icon = GetIcon(data) }; TreeViewModel.Add(treeViewNode); } } private string GetIcon(FruitsListViewModel data) { switch (data.FruitsCategory) { case 1: return "fruits"; case 2: return "fruits-item"; case 3: return "fruits-label"; case 4: return "fruits-edit"; default: return ""; } }

Nitin Kumar · Answer

function childTemplate(data) { if (data.HasChild) { return ' ' + data.Name; } else { return data.Name; } } Replace "child-icon-class" with the CSS class that represents the icon for child and sub-child nodes. We use the itemTemplate property to customize the rendering of each node. The childTemplate JavaScript function is called for each node in the TreeView, and it conditionally adds an icon for nodes with children. Make sure to define your CSS classes for the icons ( parent-icon-class and child-icon-class ) in your CSS stylesheet, or you can use an icon library like FontAwesome or Material Icons to set the icons.