Angular:从组件中获取 nativeElement

Question

有没有一种简单的方法可以从组件实例中获取 nativeElement(或 ElementRef)？我正在从这样的 View 中引用一个组件:

@ViewChild(MyComponent) myComponent: MyComponent;

我知道我可以获取 ElementRef 而不是像这样获取 MyComponent :

@ViewChild('my-component', { read: ElementRef}) myComponent: ElementRef;

如果我只需要一个 ElementRef，这很好，但我实际上需要 MyComponent 的实例，但是在稍后的某个时候我需要将它向下转换为 ElementRef，以便我可以访问 nativeElement。

Answer 1

从 Angular 9 开始，我不知道从组件引用中获取 native 元素的方法。但是，可以同时获得两者。

@ViewChild(MyComponent) component: MyComponent;
@ViewChild(MyComponent, { read: ElementRef }) elementRef: ElementRef<HTMLElement>;