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, пожалуйста, руководство

Ответы на вопрос(2)

Ваш ответ на вопрос