Javascript Angular JS-如何使用jqLite选择除了给定元素之外的任何东西?

Javascript Angular JS-如何使用jqLite选择除了给定元素之外的任何东西?,javascript,angularjs,jqlite,Javascript,Angularjs,Jqlite,我目前正在编写一个指令来处理移动应用程序中的侧菜单。我可以使用我创建的指令打开菜单,但是我需要能够使用jqLite选择菜单之外的所有内容,以便在单击菜单之外的任何内容时,可以绑定单击事件来关闭菜单 我的指令目前是: .directive('asideMenuButton', [function() { return { restrict: 'A', link: function(scope, $el, attrs) { $el.on('clic

我目前正在编写一个指令来处理移动应用程序中的侧菜单。我可以使用我创建的指令打开菜单,但是我需要能够使用jqLite选择菜单之外的所有内容,以便在单击菜单之外的任何内容时,可以绑定单击事件来关闭菜单

我的指令目前是:

  .directive('asideMenuButton', [function() {
    return {
      restrict: 'A',
      link: function(scope, $el, attrs) {
        $el.on('click', function(e) {
          e.preventDefault();

          var $aside = angular.element(document.getElementById(attrs.parent));

          if ($aside.hasClass('active')) {
            $aside.removeClass('active');
          } else {
            $aside.addClass('active');
          }
        });
      }
    };
  }]);
基本用法如下:

<a aside-menu-button href="#" data-parent="<aside ID>">Link</a>
angular.module('wowpr.directives', [])
  .directive('asideMenuButton', [function() {
    return {
      restrict: 'A',
      link: function(scope, $el, attrs) {
        var $aside = angular.element(document.getElementById(attrs.parent));
        var $body  = angular.element(document.getElementsByTagName('body'));

        $body.on('click', function(e) {
          if ($aside.hasClass('active')) {
            $aside.removeClass('active');
          }
        });

        $aside.on('click', function(e) {
          e.stopPropagation();
        });

        $el.on('click', function(e) {
          e.preventDefault();
          e.stopPropagation();

          if ($aside.hasClass('active')) {
            $aside.removeClass('active');
          } else {
            $aside.addClass('active');
          }
        });
      }
    };
  }]);

它不会在body click事件中检查被单击的元素是否是菜单,而是在单击菜单时,它会停止向body传播单击事件。这样,当您单击菜单时,不会触发正文单击事件。

将单击事件绑定到文档或正文元素。然后检查目标元素是否不是菜单的一部分。如果没有,请关闭菜单

angular.element(document).on("click",function(e){
   if( !angular.element(e.target).hasClass("someMenuClass") ) {
       closeMenu();
   }
});

将单击事件绑定到文档或主体元素。然后检查目标元素是否不是菜单的一部分。如果没有,请关闭菜单

angular.element(document).on("click",function(e){
   if( !angular.element(e.target).hasClass("someMenuClass") ) {
       closeMenu();
   }
});

对此,我提出了一个非常类似的解决方案。我会接受这一点作为答案,并在我的问题中公布我在最后做了什么。我对此有一个非常类似的解决方案。我会接受这个答案,并在我的问题中公布我最后做了什么。