调用一个函数,当我点击外面的元素,如引导带模式得到关闭



我已经创建了一个div的弹出框。当我点击一个图标时得到显示,当我点击关闭按钮时得到隐藏。但我想让它关闭,如果点击外面的弹出窗口。我能做些什么呢。我使用角在我的项目和ng-show和ng-hide显示和隐藏div。任何帮助是值得赞赏的。提前感谢。html代码

<p ng-click="openPopUP()">openPopUp</p>
<div ng-show="popup">
<p>helo</p>
<p ng-click="closePopUp()">Close</p>
</div>

Java脚本
$scope.openPopUP = function(){
$scope.popup = true;
}
$scope.closePopUp= function(){
$scope.popup = false;
}

我只是想关闭如果有人点击了div

在你的控制器中:

 angular.element(document.body).on('click', function() {
     $scope.$apply(function() {
         $scope.closePopUp();
     });
 });

首先阅读这篇文章,了解如何关闭弹出窗口。

修复@pixelbits的解决方案是添加$event.stopPropagation();在弹出窗口div.

<p ng-click="openPopUP()">openPopUp</p>
<div ng-show="popup" ng-click="$event.stopPropagation();">
<p>helo</p>
<p ng-click="closePopUp()">Close</p>
</div>

JS

angular.element(document.body).on('click', function() {
     $scope.$apply(function() {
         $scope.closePopUp();
     });
 });
$scope.openPopUP = function(){
 $scope.popup = true;
}
$scope.closePopUp= function(){
 $scope.popup = false;
}

最新更新