ix-tree with custom node item does not work in version 4.0 #2274
Description
Hi!
I updated the siemens/ix library in my project to version 4.0.0 as well I updated angular to 20. I noticed that I face a runtime error in the ix-tree component. The following error message appears in the console: "TypeError: this.renderItem is not a function". This exception pointing to this code part:
getVirtualizerOptions(refreshTreeOptions) { const list = this.buildTreeList(this.model[this.root]); return { width: "100%", height: "100%", itemHeight: 32, total: list.length, generate: index => { const item = list[index]; const renderedTreeItem = this.hostElement.querySelector([data-tree-node-id="${item.id}"]); const context = this.getContext(item.id); if (renderedTreeItem && refreshTreeOptions.force === false) { renderedTreeItem.hasChildren = item.hasChildren; renderedTreeItem.context = Object.assign({}, context); let forceRerender = this.dirtyItems.has(item.id); if (this.updates.has(item.id)) { const doUpdate = this.updates.get(item.id); if (doUpdate) { const updateRequestedRerender = doUpdate(item, Object.assign({}, this.context)); if (typeof updateRequestedRerender === "boolean") { forceRerender = updateRequestedRerender; } } } this.updatePadding(renderedTreeItem, item); if (!forceRerender) { return renderedTreeItem; } } const update = callback => { this.updates.set(item.id, callback); }; let innerElement = null; if (this.renderItem) { innerElement = this.renderItem(index, item, list, Object.assign({}, this.context), update); } if (innerElement === null) { innerElement = renderDefaultItem(item, context, update); } const el = innerElement; el.setAttribute("data-tree-node-id", item.id); el.style.paddingRight = "1rem"; this.updatePadding(el, item); this.dirtyItems.delete(item.id); return el; } }; }
Version information:
- Angular: 20.3.12
- Siemens/ix: 4.0.0
- Node: 22.20.0
- Operating system: win 11
I created a Stackblitz example and hope it's available here:
https://stackblitz.com/edit/sz6df6zc?file=src%2Fapp%2Fapp.module.ts
If you need more detailed information, I'm happy to cooperate and thank you for your help in advance.