evento ng-click de angularjs de dos etiquetas de hermanos activadas, en lugar de una
Tengo el siguiente código html
<li ng-repeat="contact in contacts">
<label ng-style="myStyle">
<input type="checkbox" ng-click="deleteContact(contact._id); myStyle={'text-decoration': 'line-through'};"/>
<img src="./images/edit_inline.gif" width="16px" height="16px" ng-click="editContact(contact._id)"/>
{{contact.username}}
{{contact.email}}
</label>
</li>
El código del controlador es el siguiente:
function mainController($scope, $http) {
$scope.deleteContact = function(id) {
$http.delete('/api/contacts/' + id)
.success(function(data) {
$scope.contacts = data;
})
.error(function(data) {
console.log('Error: ' + data);
});
};
$scope.editContact = function(id) {
$http.get('/api/search/'+id)
.success(function(data) {
$scope.formData = data;
})
.error(function(data) {
console.log('Error: ' + data);
});
}
}
Cuando hago clic en la etiqueta img para llamar a editContact, la casilla de verificación ng-click event también se activa, como resultado, el registro se elimina.
No puedo entender cómo sucede esto. Soy nuevo en angularJs, por favor guía