如何在角度8中获得元素引用名称

Question

试图获取元素引用名称，但不起作用。如果有人知道，请帮助找到解决方案。

警报应该像容器。因为这是元素引用。

app.component.html：

<div (click)="test(event)" #container></div>

app.component.ts：

test(e){
   alert(e.elementRef);
   //Output should be like alert("container");
}

Answer 1

如Kamil Augustyniak在其评论中所写，请在$event元素中使用event而不是div。

<div (click)="test($event)" #container></div>

您的组件类中的test方法将用MouseEvent调用，您可以从其MouseEvent，target或srcElement属性（取决于浏览器）中获取对该HTML元素的引用。

currentTarget

但是请注意，

test(event: MouseEvent): void {
   const htmlElement = event.target || event.srcElement || event.currentTarget;;
   ...
}

元素中的#container是Angular模板引用变量，通常与div装饰器一起使用。