Reputation: 955
I have a link that uses ng-click
inside of a table row which also uses the ng-click
directive.
When I click on the link, both ng-click
directives fire. How can I adjust them so that only the most specific one (remove item) fires?
<tr ng-repeat="item in items" ng-click="viewItem(item.id)">
<td>{{ item.name }}</td>
<td><a ng-click="removeItem(item.id, 'item.name')">Remove item</a></td>
</tr>
Thanks!
Upvotes: 3
Views: 565
Reputation: 5419
You just need to stop the event from bubbling by using stopPropagation()
.
<tr ng-repeat="item in items" ng-click="viewItem(item.id)">
<td>{{ item.name }}</td>
<td><a ng-click="removeItem(item.id, 'item.name'); $event.stopPropagation()">Remove item</a></td>
</tr>
Upvotes: 6