jetcom
jetcom

Reputation: 955

Ng-click inside of ng-click AngularJS

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

Answers (1)

L105
L105

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>

jsFiddle

Upvotes: 6

Related Questions