angular+adminlte使用心得
2017-07-07 11:58
169 查看
今天用angular 集成adminLte的时候 ,发现左边侧边栏动画没有展开,然后发现,它APP js tree函数操作的DOM 不对,修改如下
$.AdminLTE.tree = function (menu) { var _this = this; var animationSpeed = $.AdminLTE.options.animationSpeed; $(document).off('click', menu + ' li a') .on('click', menu + ' li a', function (e) { //Get the clicked link and the next element var $this = $(this); var checkElement = $this.next(); //Check if the next element is a menu and is visible if ((checkElement.is('.treeview-menu')) && (checkElement.is(':visible')) && (!$('body').hasClass('sidebar-collapse'))) { //Close the menu checkElement.slideUp(animationSpeed, function () { //Fix the layout in case the sidebar stretches over the height of the window //_this.layout.fix(); }); checkElement.parent("li").removeClass("menu-open"); checkElement.parent("li").removeClass("active"); } //If the menu is not visible else if ((checkElement.is('.treeview-menu')) && (!checkElement.is(':visible'))) { //Get the parent menu var parent = $this.parents('ul').first(); //Close all open menus within the parent var ul = parent.find('ul:visible').slideUp(animationSpeed); //Remove the menu-open class from the parent ul.removeClass('menu-open'); //Get the parent li var parent_li = $this.parent("li"); //Open the target menu and add the menu-open class parent_li.addClass('menu-open'); checkElement.slideDown(animationSpeed, function () { //Add the class active to the parent li // checkElement.addClass('menu-open'); ul.parent().removeClass('menu-open'); parent.find('li.active').removeClass('active'); parent_li.addClass('active'); //Fix the layout in case the sidebar stretches over the height of the window _this.layout.fix(); }); } //if this isn't a link, prevent the page from being redirected if (checkElement.is('.treeview-menu')) { e.preventDefault(); } }); };
相关文章推荐
- angularJS $watch $timeout 使用心得
- Asp.Net Core 项目实战之权限管理系统(1) 使用AdminLTE搭建前端
- angular.bind使用心得
- AdminLTE使用动态include实现多套菜单
- ag-admin部署使用心得
- angular中ui calendar的一些使用心得
- 使用前端后台管理模板库admin-lte
- angular.bind使用心得
- ABP+AdminLTE+Bootstrap Table权限管理系统第一节--使用ASP.NET Boilerplate模板创建解决方案
- Angular中的ngRepeat使用心得
- angular+ui-router+layui的使用心得
- 基于angular-utils-ui-breadcrumbs使用心得(分享)
- 使用前端后台管理模板库admin-lte(转)
- Angular集成admin-lte框架
- Vue使用Bootstrap实现AdminLTE风格(仿CoPilot)
- laravel-admin 使用心得
- material_admin框架 使用心得记录
- angular中ui calendar的一些使用心得(推荐)
- ABP+AdminLTE+Bootstrap Table权限管理系统第一节--使用ASP.NET Boilerplate模板创建解决方案
- JSTL使用心得