0

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

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

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);
    }
}

如何确定数据何时完成加载，然后选择第一个节点？

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

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

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

4

1 回答 1

1

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

尝试这样的事情：

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

看演示

于 2020-12-08T13:06:58.707 回答