AngularJS - Как скрыть div при нажатии за его пределами

У меня есть приложение angularjs, которое использует для открытия и скрытия скрытого div.

Вот пример jsfiddle с образцом - jsfiddle

$scope.openLogin = function(){
    $scope.userLogin = true;
};
 $scope.hideLoginContainer = function(){
    $scope.userLogin = false;
};

Когда я нажимаю на ссылку "Нажмите здесь", он отобразит логин входа пользователя, поэтому мне нужно скрыть этот div, когда я нахожусь снаружи. Проблема, с которой я сталкиваюсь здесь, - это даже щелкнуть внутри пользовательского логина, который он скроет.

Кто-нибудь знает какие-нибудь хорошие идеи? Благодаря

Ответ 1

Он должен быть обработан, просто отредактируйте: <div hide-login="hideLoginContainer()" class="loginBox" ng-show="userLogin" style="display:none;" >

Ответ 2

Вы можете проверить originalTarget или srcElement в обработчике событий $document.bind('click'), и если он будет соответствовать элементу loginBox, то вы его не скроете.

Изменить: я просто понял... вы должны использовать stopPropagation() также в элементе loginBox, этого должно быть достаточно, чтобы исправить скрытие, когда вы нажимаете внутри окна входа