AngularJS ng-click 停止传播 [英] AngularJS ng-click stopPropagation
本文介绍了AngularJS ng-click 停止传播的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在表格行上有一个点击事件,在这一行中还有一个带有点击事件的删除按钮.当我单击删除按钮时,该行上的单击事件也会被触发.
I have a click Event on a table row and in this row there is also a delete Button with a click Event. When i click the delete button the click Event on the row is also fired.
这是我的代码.
<tbody>
<tr ng-repeat="user in users" class="repeat-animation" ng-click="showUser(user, $index)">
<td>{{user.firstname}}</td>
<td>{{user.lastname}}</td>
<td>{{user.email}}</td>
<td><button class="btn red btn-sm" ng-click="deleteUser(user.id, $index)">Delete</button></td>
</tr>
</tbody>
如何防止在单击表格单元格中的删除按钮时触发 showUser
事件?
How can I prevent that the showUser
Event is fired when i click the delete Button in the table cell?
推荐答案
ngClick 指令(以及所有其他事件指令)创建在相同范围内可用的 $event
变量.这个变量是对 JS event
对象的引用,可以用来调用 stopPropagation()
:
ngClick directive (as well as all other event directives) creates $event
variable which is available on same scope. This variable is a reference to JS event
object and can be used to call stopPropagation()
:
<table>
<tr ng-repeat="user in users" ng-click="showUser(user)">
<td>{{user.firstname}}</td>
<td>{{user.lastname}}</td>
<td>
<button class="btn" ng-click="deleteUser(user.id, $index); $event.stopPropagation();">
Delete
</button>
</td>
</tr>
</table>
这篇关于AngularJS ng-click 停止传播的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文