0
私は外側のクリックで閉じることを実装しようとしていますが、要素は外側のクリックで閉じていますが、内側のクリックでも閉じます。 http://plnkr.co/edit/ybYmHtFavHnN1oD8vsuw?p=preview外側のクリックで角を閉じる - 内側のクリックでも閉じます
私は理解していない、なぜそれが彼の子供である場合、element.findがターゲットを見つけることができない。
HTML指令
<div class='multiDate'>
<div class="dropdown">
<button data-ng-click="show = !show" class="dropbtn">Press</button>
<div id="myDropdown" ng-show="show" class="dropdown-content">
<multiple-date-picker></multiple-date-picker>
</div>
</div>
</div>
HTMLメイン
<html>
<head>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script data-require="[email protected]" data-semver="1.6.4" src="https://code.angularjs.org/1.6.4/angular.min.js"></script>
<script data-require="[email protected]*" data-semver="2.14.1" src="https://npmcdn.com/[email protected]"></script>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="https://arca-computing.github.io/MultipleDatePicker/stylesheets/multipleDatePicker.css" />
<script src="https://arca-computing.github.io/MultipleDatePicker/javascripts/multipleDatePicker.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="app" ng-controller="cntrl">
<multi-date></multi-date>
</body>
</html>
JS
var app = angular.module("app", ['multipleDatePicker']);
app.controller("cntrl", function($scope) {
});
app.directive('multiDate', function($document) {
return {
templateUrl: 'multi.html',
replace: true,
link: function(scope, element) {
$document.bind('click', function(event) {
var isClickedElementChildOfPopup = element
.find(event.target)
.length > 0;
if (isClickedElementChildOfPopup)
return;
scope.show = false;
scope.$apply();
});
}
}
});
ありがとうです！私はちょうど別の解決策を見つけましたが、あなたはより良いです。 –