从 Ionic/Angular 是否有可能获得对底层 Stencil Web 组件的引用？

Question

我有一个 Ionic 6/Angular 10 应用程序使用离子内容区域。

我 运行 遇到的问题是 angular ngAfterViewInit() 回调在 DOM 完全呈现之前触发，因此我在该回调期间所做的任何大小查询都会结束不准确。我一直在努力寻找一些回调让我知道渲染过程何时完成，以便我可以查询元素的最终大小，但无济于事。

我遇到了这个 github 问题讨论：https://github.com/ionic-team/ionic-framework/issues/17920

这似乎意味着可以获取对基于 Stencil 的底层 Web 组件的引用，以便在该级别挂钩回调并获取我正在寻找的回调，即 componentDidRender()。

但是，跟帖中的示例并未提供对 Stencil 文档中提到的方法的任何引用。

是否可以获得对底层 Ionic Web 组件的引用？如果可以，怎么做？

谢谢。

Answer 1

我假设您要查找的是 DOM 元素引用，这是通过 Angular 中的 ViewChild 完成的。

https://angular.io/api/core/ViewChild

<my-component #component>

@ViewChild('component') component;

ngAferViewInit() {
  this.component.nativeElement.addEventListener('componentDidLoad', console.log);
}