How to programmatically insert nodes into a treeview with remote data

[Murray]

My treeview is defined as follows:

            <kendo-treeview
              #treeView
              kendoTreeViewExpandable
              kendoTreeViewSelectable
              (selectionChange)="edit($event)"
              [(expandedKeys)]="expandedKeys"
              textField="text"
              [filter]="filterTerm"
              [nodes]="keyValues$ | async"
              [children]="fetchChildren"
              [hasChildren]="hasChildren"
            >

As the screen is opened I set the expandedKeys so that some of my nodes are by default opened, and the data is automatically loaded in.

However certain nodes have children which I would also like to load when their parent is opened, and  to further complicate the matter, a different call to the server is required than the one defined in fetchChildren for fetching this data.

Is there any way I can independently load this data, not using fetchChildren and then programmatically insert it into the tree?  It seems as though there isn't a way to perform a hybrid approach to data loading...

 

[Murray]

I have actually found a workaround for this problem by switching back to using local data mode using kendoTreeViewHierarchyBinding, then using a forkJoin to wait for all my node queries to resolve, then building my nodes. 

[Martin Bechev]

Hi Murray,

I saw that you've already found a solution to this case, but let me suggest one more way of loading nodes on demand.

Please check the following article about the Load more button functionality and how to fetch new nodes on demand from the server.

https://www.telerik.com/kendo-angular-ui/components/treeview/load-more-button/#toc-remote-data

Regards,
Martin
Progress Telerik