我怎么知道数据何时加载到 p-tree 和 select 第一个节点？

Question

我试图 select Angular PrimeNG 树组件的第一个节点，但我唯一能做的就是 select 根节点，但这并没有'触发它的点击事件

我正在尝试找到一种方法，如何在组件上加载数据后触发第一个节点上的点击事件。

ngAfterViewInit() {
        setTimeout(() => {
            this.node = this.files[0].expanded = true;
            this.node = this.files[0];
        }, 2000);
    }

树中填充了 JSON 通过服务中的承诺从端点获取的数据，例如此处的示例 https://www.primefaces.org/primeng/v7.2.6-lts/#/tree :

@Injectable()
export class NodeService {

    constructor(private http: Http) {}

    getFiles() {
        return this.http.get('showcase/resources/data/files.json')
                    .toPromise()
                    .then(res => <TreeNode[]> res.json().data);
    }
}

我如何确定数据何时完成加载到第一个节点然后 select 第一个节点？

我在 stackblitz 上分叉了一个示例，唯一的区别是它使用可观察对象而不是 promise 来填充数据： https://stackblitz.com/edit/angular-primeng-tree-sml-9swyq6?file=src/app/app.component.ts

在这个例子中，我启用了 loading=true。

那么我如何才能知道加载完成时，将加载切换为 false 和 select 并触发点击树的第一个节点？

Answer 1

您应该在承诺的 return 中展开第一个节点，而不是在 ngAfterViewInit 方法中展开，因为那时数据可能不可用。

尝试这样的事情：

this.nodeService.getFiles().then(files => {
  this.files1 = files;
  this.files1[0].expanded = true;
  this.loading = false;
});

见demo

我怎么知道数据何时加载到 p-tree 和 select 第一个节点？

How can I know when the data are loaded on p-tree and select first node?

angular

typescript

primeng

primeng-tree