이벤트를 기반으로 bs-popover를 숨기는 방법

bs-popover를 사용하여 angularjs의 클릭 (메뉴로)에 내용을 표시하고 있습니다. 하지만 브라우저 창을 클릭 할 때 popover-menu를 숨길 필요가 있습니다. 나는 그 종류의 사건에 대해 기각되기를 원한다. 어떻게해야합니까?이벤트를 기반으로 bs-popover를 숨기는 방법

출처

2013-05-27 anilCSE

'BS-popover' 트위터 부트 스트랩 팝 오버를 의미한다 :

을 팝 오버를 유발하여 요소에? – callmekatootie

예. 그것 부트 스트랩에서 – anilCSE

내 대답은 당신을 위해 작동합니다. :) –

이에 대한 지침을 작성해야합니다.

yourApp.directive('bndocumentclick', 
function($document,$rootScope,$timeout) { 
    return { 
    restrict: 'EA', 
    link : function(scope, element, attrs) { 
     $document.on("click", function(ev) { 
      // Do stuff here to remove your popover. 
     } 
    } 
} 
});

HTML

<body bndocumentclick>

그리고 당신은 당신이 당신의 팝 오버를 닫 좋아하지 않기 때문에 사용할 필요가

<div bs-popover ng-click="$event.stopPropagation()">

때마다 팝 오버 내부 사용자가 클릭.

출처

2013-08-21 10:48:03

@Jay Shukla가 제공 한 해결 방법이 작동하지 않습니다.

popover를 트리거하는 요소의 "$ event.stopPropagation()"은 popover 내부에서 클릭을 할 때 닫히지 않습니다. popover 내부에서 어떤 상호 작용이 있으면 문제가 될 수 있습니다 .

이 작동합니다 : 당신의 몸에

angular.module('yourApp') 
.directive('closePopovers', function ($document, $rootScope, $timeout) { 
return { 
    restrict: 'EA', 
    link: function (scope, element, attrs) { 
    $document.on('click', function (ev) { 

     var targetElem = angular.element(ev.target); 

     if (targetElem.data('toggle') !== 'popover' 
     && targetElem.parents('[data-toggle="popover"]').length === 0 
     && targetElem.parents('.popover').length === 0) { 

     $('.popover').each(function() { 
      var $this = $(this); 
      var scope = $this.scope(); 
      scope.$apply(function() { 
       scope.$hide(); 
      }); 
      } 
     ); 
     } 
    }); 
    } 
}; 
});

<button data-toggle="popover" [other data elements here] bs-popover>Toggle popover</button>

출처

2014-04-03 07:35:50

이벤트를 기반으로 bs-popover를 숨기는 방법

답변

관련 문제