javascript - 使用 @ViewChild 按类名选择元素？

Question

这个问题已经有答案了:

What are all the valid selectors for ViewChild and ContentChild? (2 个回答)

已关闭 4 年前。

在本文中Create Advanced Component作者首先创建一个指令来选择一个元素:

@Directive({
  selector: '.tooltip-container'
})
export class TooltipContainerDirective {}

然后使用该指令选择包含类 .tooltip-container 的元素像这样:

    @Component({
    template: `
        <div class="tooltip-container" [ngStyle]="{top: top}">
        <ng-content></ng-content>
        </div>
    `,
    styles: [...]
    })
    export class TooltipComponent implements OnInit {
    top : string;
    @ViewChild(TooltipContainerDirective, { read: ElementRef }) private tooltipContainer;


    }

Angular 是否能够选择tooltipContainer按类名元素而不使用指令？

Answer 1

嗨，我认为你的代码应该可以工作，...
顺便提一句。您可以像 CSS 选择器一样使用 ViewChild 选择器(因此 @ViewChild('.tooltip-container') 也应该可以工作(注意:@ViewChild 只会返回第一个结果)。
此外，您可以在任何 HTML 元素上使用 #myId，然后使用 @VievChild('myId')

选择子元素但我不认为这是你的问题，你是否可能尝试在 ngOnInit 中访问 ViewChild？，因为那行不通...... subview 将在渲染 View 时可用因此，您第一次访问子级是 ngAfterViewInit。