typescript 如何在onclick事件中获得角度4的跨度值？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/46016791/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to get span value in angular 4 in onclick event?
提问by KULDEEP BISEN
I'm working on angular 4 and I'm trying to implement functionality where I can remove tag by clicking on the cross button. so below is my code :
我正在研究 angular 4，我正在尝试实现可以通过单击十字按钮删除标签的功能。所以下面是我的代码：
Component.hmtl
组件.hmtl
<ul id="ul_top_hypers">
<li *ngFor="let hero of technologies">
<span class="badge badge-pill badge-primary" >{{ hero }}<i class="fa fa-cross-circle-right fa-lg" (click)="removeTag1($event)"></i></span>
</li>
</ul>
Component.ts
组件.ts
removeTag(event: any) {
console.log(event.target.parentNode.value);
console.log(event.target.value);
}
I wanted to get span value of every lielement by clicking on cross button so that I can remove that perticular tag. But I'm getiing undefindin console.
我想li通过单击十字按钮来获取每个元素的跨度值，以便我可以删除那个特定的标签。但我正在undefind控制台中。
any help is too appreciable.
任何帮助都太可观了。
回答by Günter Z?chbauer
I'd just use the index
我只是使用索引
<ul id="ul_top_hypers">
<li *ngFor="let hero of technologies;let i=index">
<span class="badge badge-pill badge-primary" >{{ hero }}<i class="fa fa-cross-circle-right fa-lg" (click)="removeTag1(i)"></i></span>
</li>
</ul>
by adding ;let i=indexthe index becomes available and(click)="removeTag1(i)"passes the index to the removeTag(...)method. If you pass the value, you first need to find the value in the array before you can delete it, if you pass the index, you know immediately what array item to delete.
通过添加;let i=index索引变得可用(click)="removeTag1(i)"并将索引传递给removeTag(...)方法。如果传递值，首先需要在数组中找到该值，然后才能删除它，如果传递索引，则立即知道要删除哪个数组项。
回答by Rob Lassche
I get information from my mediawiki and display it in a div in an angular2+ html form.
我从我的 mediawiki 获取信息并以 angular2+ html 形式将其显示在 div 中。
<div class="wiki" (click)="getWikiPage($event)">
<div [innerHtml]="pageContent"> </div>
</div>
The mediawiki generated TC looks like this:
mediawiki 生成的 TC 如下所示：
<span class="toctext">Welcome</span>
In the component I get the information about the span value:
在组件中，我获得了有关跨度值的信息：
getWikiPage(e) {
e.stopPropagation();
if (e.srcElement.nodeName == 'SPAN') {
console.log('Wiki TC span value: ', e.srcElement.innerHTML)
}
return false;
}
