这里有一个例子。假设我想要一个图像叠加像很多网站。因此，当您点击缩略图时，整个窗口上会显示一个黑色叠加层，而图片的较大版本位于其中央。点击黑色覆盖层会将其忽略;单击图像将调用显示下一个图像的函数。
html：
<div ng-controller="OverlayCtrl" class="overlay" ng-click="hideOverlay()">
<img src="http://some_src" ng-click="nextImage()"/>
</div>
javascript：
function OverlayCtrl($scope) {
$scope.hideOverlay = function() {
// Some code to hdie the overlay
}
$scope.nextImage = function() {
// Some code to find and display the next image
}
}
问题是，使用此设置，如果您单击图像，则nextImage()和hideOverlay()都被调用。但我想要的是只有nextImage()被调用。
我知道你可以捕获和取消事件在nextImage()函数像这样：
if (window.event) {
window.event.stopPropagation();
}
什么@JosephSilber说，或传递$事件对象到ng单击回调和停止传播它：
原文链接：https://www.f2er.com/angularjs/147455.html<div ng-controller="OverlayCtrl" class="overlay" ng-click="hideOverlay()"> <img src="http://some_src" ng-click="nextImage($event)"/> </div>
$scope.nextImage = function($event) {
$event.stopPropagation();
// Some code to find and display the next image
}
