如何在DevExtreme TreeView中通过ID程序化选中项

我在Angular 19项目中使用DevExtreme-Angular 24.1.7的dx-tree-view做侧边导航，代码如下：

<dx-tree-view
    (onItemClick)="navigateToItem($event)"
    [items]="treeViewData()"
    [searchEnabled]="true"
    [selectByClick]="true"
    selectionMode="single">
</dx-tree-view>

需要在三种页面切换场景下保持导航树同步（目标页面及其父项需选中并展开）：

• URL输入导航：通过初始加载URL参数调用API获取树数据，已实现且正常工作；
• 树内导航：通过navigateToItem($event)实现自动展开，正常工作；
• 其他组件导航：可获取目标页面参数并传给树组件，但找不到简洁的同步方式，不想遍历庞大的嵌套数组，也尽量避免使用effect。请问是否有通过ID选中项的API、事件或属性？我查阅了文档但未找到合适方案，盼解答。

另外我已提交DevSupport工单T1267070，若先得到官方答复会同步更新。

DevExtreme TreeView 提供了直接通过项的key值进行选中和展开的API，无需手动遍历嵌套数组：

1. 获取TreeView实例
   在组件中通过ViewChild获取TreeView的实例：

   import { Component, ViewChild } from '@angular/core';
   import { DxTreeViewComponent } from 'devextreme-angular';
   
   @Component({
     // 组件元数据
   })
   export class SideNavComponent {
     @ViewChild(DxTreeViewComponent) treeView!: DxTreeViewComponent;
   
     // 其他业务代码
   }
   

2. 选中并展开目标项
   当从其他组件拿到目标页面的ID（对应TreeView项的key字段）后，调用以下API：

   • selectItem(key)：通过key选中指定项
   • expandToItem(key)：自动展开从根节点到目标项的所有父节点

   syncTreeView(targetItemKey: string | number) {
     if (this.treeView.instance) {
       // 选中目标项
       this.treeView.instance.selectItem(targetItemKey);
       // 展开到目标项（自动展开所有父节点）
       this.treeView.instance.expandToItem(targetItemKey);
     }
   }
   

3. 注意事项

   • 确保treeViewData中的每个项都配置了唯一的key字段，这是API定位项的前提；
   • 若TreeView数据为异步加载，需在数据加载完成后再调用上述API，比如监听数据加载完成的信号后触发同步逻辑。

内容的提问来源于stack exchange，提问作者T. Jami