Question

在本文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-Selector一样使用ViewChild-Selector（因此@ViewChild('.tooltip-container')也应该可以正常使用（注意：@ViewChild将仅返回第一个结果）。
此外，您可以在任何HTML元素上使用#myId，然后使用@VievChild('myId')

选择子元素但是我不认为这是您的问题，可能您正在尝试访问ngOnInit中的ViewChild吗？因为这不起作用...在呈现视图时该子项将可用，因此第一个您可以访问孩子的时间是ngAfterViewInit。

使用@ViewChild通过类名称选择元素？

1 个答案: