避免点击表格行

时间:2017-01-03 09:41:38

标签: angular onclick

我在表格行中添加了一个按钮。但我想分别为他们处理onClick事件。但是当我点击按钮时,表格行点击事件也会被触发。如何仅在单击按钮时仅触发按钮单击元素。这是我目前正在使用的代码

<table class="table" style="width:100%;">
      <div  *ngFor="let data of Data; let j = index;">
            <tr [ngClass]="{onClickMember: data .clicked}" (click)="addData(data , j)">                
              <td width="15%">{{member.name}}</td>
                 <td width="15%"><button class="role-toggle" (click)="changeData(data , j)">{{data .role}}</button></td>

              </tr>
     </div>
</table>

1 个答案:

答案 0 :(得分:11)

您可以在(点击)功能中传递特殊$event对象。

<button class="role-toggle" (click)="changeData($event, data , j)>

在代码中捕获事件并停止传播

changeData(event, data, j) {
   event.stopPropagation()
}