我正在使用带 Angular 的 Bootstrap 3。当我单击链接时,页面不会重新加载,导致菜单在移动模式下保持打开状态。
单击菜单项时如何使菜单自动关闭?
我试过只添加 data-toggle="collapse" data-target=".navbar-responsive-collapse"
到a
标签,但它会在桌面模式下导致奇怪的行为。
最佳答案
这只是先前答案的更新版本
angular.module('app').directive('navCollapse', function () {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var visible = false;
element.on('show.bs.collapse', function () {
visible = true;
});
element.on("hide.bs.collapse", function () {
visible = false;
});
element.on('click', function(event) {
if (visible && 'auto' == element.css('overflow-y')) {
element.collapse('hide');
}
});
}
};
});
HTML
<div class="collapse navbar-collapse navbar-app-collapse" nav-collapse="">
<ul class="nav navbar-nav">
</ul>
</div>
关于twitter-bootstrap - 在移动模式下导航(链接单击)时折叠导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18324157/