Question

我有点击登录菜单及其显示，但我点击它仍然打开。现在我需要实现当用户点击页面上的任何地方我关闭此菜单。任何建议？

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


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

我试过这个但没有成功：

 angular.element(document).on('click', function () {
        alert("test");
        if ($scope.loggedInOpened == true) {
            $scope.loggedInOpened = false

        }

Answer 1

问题可能是你的作用域在两个函数执行的地方没有共享？您是否尝试将 $ scope 更改为 $ rootScope？我假设您在获取提醒（＆＃34;测试＆＃34;）时发出消息点击发生了吗？

Answer 2

使用z-index创建一个屏幕填充但透明的div：1并使您的登录菜单z-index：2。然后在此div上添加一个ng-click，调用一个函数，使透明div再次隐藏并让你登录菜单崩溃。

Answer 3

您可以向透明div添加指令。

if (!Directory.Exists("D:\\GitRepos\\" + repositoryName))
        {
            Directory.CreateDirectory("D:\\GitRepos\\" + repositoryName);
            File.Create("D:\\GitRepos\\" + repositoryName + "\\README.md").Close();
        }

        Repository.Init("D:\\GitRepos\\" + repositoryName);

        using (var repo = new Repository("D:\\GitRepos\\" + repositoryName))
        {
            repo.Index.Add("README.md");
            Signature author = new Signature("user", "user@user.com", DateTime.Now);
            Signature committer = author;
            repo.Commit("Initial Commit", author, committer);
            repo.Network.Remotes.Add("origin", validRepoHttpsUrl);
            Remote remote = repo.Network.Remotes["origin"];

            var options = new PushOptions
            {
                CredentialsProvider = (_url, _user, _cred) =>
                    new UsernamePasswordCredentials {Username = "validuser", Password = "validpassword"}
            };

            string pushRefSpec = @"refs/heads/master";
            repo.Network.Push(remote, pushRefSpec, options);

        }

}

这是样本。当你点击页面＆＃34;你好＆＃34;被切换了 [链接] http://plnkr.co/edit/3iPQeWWz4sD2J7qT7ixy?p=preview

Answer 4

答案是事件传播。

在覆盖主页面，主div，表单甚至正文的元素上设置自定义指令。在此指令中，将元素绑定到click事件。在新的单击事件函数内部，通过id或class找到您的登录div，并将其CSS显示设置为none。如果您点击页面上的任何位置，即使在其中，也会隐藏div。

现在要阻止登录div关闭，如果它内部的单击添加一个单独的自定义指令并绑定到单击。在这里只是调用事件的停止传播方法，它将保持打开状态。

如何隐藏页面上任何位置的菜单？

4 个答案: