Disable ng-click in parent div [duplicate]

Question

I have next html:

<div class="parent"
         ng-click="ParentClick()">
    .
    .
    .
    <div class="child" ng-click="ChildClick()">
       Some Text
    </div>
</div>

So, when I click on Some Text, I have two method calls: ParentClick(), ChildClick(). Is it possible to disable ParentClick() event when I clicking on Some Text, in CSS way?

Answer 1

When clicking on the ChildClick() you want to run event.stopPropagation() in order to prevent the click event to bubble up the DOM tree

function ChildClick() {
    event.stopPropagation()
    ....
}

In case you have the ChildClick function part of the $scope you can pass the $event to the function and use it inside:

<div class="child" ng-click="ChildClick($event)">
</div>

$scope.ChildClick = function ($event) {
    $event.stopPropagation();
    ...
};