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

Question

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

我试图找到一种方法，当数据已加载到组件上时，如何在第一个节点上触发 click 事件。

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

tree is populated with JSON data fetched from an endpoint via a promise in a service like the example here 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 上创建了一个示例，唯一的区别是它使用 observable 而不是 promise 来填充数据： https://stackblitz.com/edit/angular-primeng-tree-sml-9swyq6?file=src/app/ app.component.ts

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

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

Answer 1

您应该在 promise 的返回中展开第一个节点，而不是在ngAfterViewInit方法中，因为此时数据可能不可用。

尝试这样的事情：

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

看演示