扫码关注官方订阅号
试过了好多办法都没有实现,求助
认证0级讲师
我使用的trick是,利用冒泡达到点击菜单外部关闭菜单的目的:
var demo = angular.module('demo', []); demo.directive('menu', function(){ return { restrict: 'E', scope: {}, link: function(scope, element, attrs) { scope.displayMenu = false; scope.showMenu = function(e) { scope.displayMenu = true; e.stopPropagation(); }; scope.clickInner = function(e) { e.stopPropagation(); }; document.addEventListener('click', function(){ scope.displayMenu = false; scope.$apply(); }, false); }, template: '<button class="showBtn" ng-click="showMenu($event)">显示菜单</button>' + '<p class="menu" ng-class="{show: displayMenu}" ng-click="clickInner($event)">' + '<ul>' + '<li>菜单一</li>' + '<li>菜单二</li>' + '<li>菜单三</li>' + '</ul>' + '</p>' }; });
在线例子: jsfiddle
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
我使用的trick是,利用冒泡达到点击菜单外部关闭菜单的目的:
在线例子: jsfiddle