如何隐藏div点击页面上的任何位置？

Question

好吧,我有主头控制器,我有这个:

<div class="fade-show-hide" ng-class="{'ng-hide':loggedInClose==true}" ng-show="loggedInOpened" ng-cloak>
@Html.Partial("~/Views/Shared/_LoggedInPartial.cshtml")
</div>

在脚本我有这个:

$ scope.loggedInClose = false;

  $scope.toggleLoggedIn = function () {
        $scope.loggedInOpened = !$scope.loggedInOpened;
        $scope.languagesOpened = false;
        $scope.loginOpened = false;  
    };

问题是当我使用这个代码没有发生任何事情...我得到$scope.loggedInClose = true;但div不隐藏...

angular.element(document).on('click', function () {

    $scope.loggedInClose = true;

});

如果我点击页面上的任何地方,有人可以解释我如何隐藏div吗？

Answer 1

单独使用ng-hide而不是内部使用ng-class。因此将 HTML 更改为：

<div class="fade-show-hide" ng-hide="loggedInClose" ng-show="loggedInOpened" ng-cloak>

我认为您的更改没有得到应用：

$scope.$apply();之后使用$scope.loggedInClose = true;

请参阅 plunkr“ http://plnkr.co/edit/0u7u4InJsJpI4g4E8vvg?p=preview ”