Question

我正在处理角度4并尝试实现我可以通过点击十字按钮删除标记的功能。以下是我的代码：

Component.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

 removeTag(event: any) {
    console.log(event.target.parentNode.value);
    console.log(event.target.value);
   }

我希望通过单击十字按钮获取每个li元素的跨度值，以便我可以删除该特定标记。但是我在控制台中undefind。{/ p>

任何帮助都太明显了。

Answer 1

我只是使用索引

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

通过添加;let i=index索引变得可用，并且 (click)="removeTag1(i)"将索引传递给removeTag(...)方法。如果传递该值，首先需要在删除它之前在数组中找到该值，如果传递索引，则立即知道要删除的数组项。

Answer 2

我从mediawiki获得信息，并以Angular2 + html格式将其显示在div中。

<div class="wiki" (click)="getWikiPage($event)">
    <div [innerHtml]="pageContent"> </div>
</div>

mediawiki生成的TC如下：

<span class="toctext">Welcome</span>

在组件中，我获得有关范围值的信息：

getWikiPage(e) {
    e.stopPropagation();
    if (e.srcElement.nodeName == 'SPAN') {
      console.log('Wiki TC span value: ', e.srcElement.innerHTML)
    }
    return false;
}

如何在onclick事件中获得角度4的跨度值？

2 个答案: