JSFiddle - React, Tailwind, and code Playground
HTML
<div ng-app ng-controller="myCtrl">
<div class="outer" ng-click="toggle()">
<div class="inner">You can click through me</div>
</div>
<div class="outer" ng-click="toggle()">
<div class="inner" ng-click="$event.stopPropagation()">You can not click through me</div>
</div>
</div>
CSS
.outer{
border:1px solid #000000;
padding:50px;
}
.inner{
border:1px solid red;
width:200px;
height:50px;
}
JavaScript
function myCtrl($scope) {
$scope.user = {
firstName: "Foo",
lastName: "Bar"
};
$scope.logins = [];
$scope.login = function () {
$scope.logins.push($scope.user.firstName + " was logged in.");
};
$scope.toggle = function(){
alert("yo");
}
}