angularjs ng-click событие запускает один братский тег вместо одного
У меня есть следующий 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>
Код контроллера выглядит следующим образом:
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);
});
}
}
Когда я нажимаю на тег img для вызова editContact, флажок ng-click также срабатывает, в результате запись удаляется.
Я не могу понять, как это происходит. Я новичок в angularJs, пожалуйста, руководство