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

在本文中，作者通过首先创建一个指令来选择一个元素：

@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;


    }

@组件({
模板：`
`,
样式：[……]
})
导出类TooltipComponent实现OnInit{
顶部：字符串；
@ViewChild（TooltipContainerDirective，{read:ElementRef}）私有tooltipContainer；
}

---

Angular是否能够在不使用指令的情况下按类名选择

tooltipContainer

元素？

您好，我认为您的代码应该可以工作
顺便说一句，您可以像CSS选择器一样使用ViewChild选择器（因此

@ViewChild（'.tooltip container'）

也应该可以工作（注意：@ViewChild将只返回第一个结果）。
此外，您可以在任何HTML元素上使用

#myId

，然后使用

@VievChild（'myId'）

---

但我不认为这是您的问题，您是否可能正在尝试在

ngOnInit

中访问ViewChild？因为这不起作用…在呈现视图时，该子视图将可用，因此您第一次可以访问该子视图是

ngAfterViewInit

不，您不能通过CSS选择器使用任何查询f进行选择eatures.@reactular当然可以：=>指令configuration@Nickolaus-这不是针对

@ViewChild

。正如@Nickolaus意识到的，作者使用该指令使

工具容器

在

ngOnInit

中可用，而不是

ngAfterViewInit

。有趣而微妙的区别。啊哈！是的，好直觉。教程作者正在访问

ngOnInit

中的

tooltipContainer

，这可能就是他使用

tooltip container

指令获取

tooltipContainer ElementRef

的原因。