[英]How to set menu active in master page using angular js
I want to set menu active in master page from different page. 我想在不同页面的母版页中将菜单设置为活动状态。
i am using sidebar from one page, header from one page and footer from one page. 我从一页使用侧边栏,从一页使用页眉,从一页使用页脚。
all the three pages are combined. 这三个页面全部合并在一起。
I am using 10 UI's in angular js. 我在angular js中使用10个UI。 when i moved to different UI i want to set active only the selected UI.
当我移到其他UI时,我只想将选定的UI设置为活动状态。
before I am using this jquery 在我使用这个jQuery之前
$("#sidebar").load("slidebar.html", function () {
$(".sidebar ul li ul li").closest("li").find(".active").removeClass("active");
$("#ManageUserID").addClass("active").parents(".nav li").addClass("active open");
});
this is working nicely. 这很好。
Now i am going to hide the UI based on user view and edit permission(UI Hide) so now i am using ng-include to Include the UI's. 现在,我将基于用户视图和编辑权限(UI隐藏)隐藏用户界面,因此现在我使用ng-include来包含用户界面。
after that i am trying to set menu active like this 之后,我试图将菜单设置为这样
controller=SlideController1 控制器= SlideController1
MainMenuActive="active open"
ActiveRole="active"
controller=SlideController2 控制器= SlideController2
MainMenuActive="active open"
ActiveUser="active"
controller=SlideController3 控制器= SlideController3
MainMenuActive="active open"
ActiveFacility="active"
<li ng-controller="SlideController1 || SlideController2 || SlideController3" class={{MainMenuActive}} >
<a href="#" class="dropdown-toggle">
<i class="menu-icon fa fa-desktop"></i>
<span class="menu-text">
Security
</span>
<b class="arrow fa fa-angle-down"></b>
</a>
<b class="arrow"></b>
<ul class="submenu">
<li class={{ActiveRole}} ng-model="ManageRole" id="ManageRoleID" >
<a href="ManageRole.html">
<i class="menu-icon fa fa-caret-right"></i>
Manage Role
</a>
<b class="arrow"></b>
</li>
<li class={{ActiveUser} id="ManageUserID">
<a href="manageuser.html">
<i class="menu-icon fa fa-caret-right"></i>
Manage User
</a>
<b class="arrow"></b>
</li>
<li class={{ActiveFacility}} id="ManageFacilityID">
<a href="ManageFacility.html">
<i class="menu-icon fa fa-caret-right"></i>
Manage Facility
</a>
<b class="arrow"></b>
</li>
</ul>
</li>
here i am not able to add three controller. 在这里,我无法添加三个控制器。
now i want to set menu active by selected UI how to do in angular JS. 现在我想通过选定的用户界面将菜单设置为活动状态,如何在角度JS中进行操作。
instead of the old script 而不是旧的脚本
<script>
$(function () {
$(".sidebar ul li ul li").closest("li").find(".active").removeClass("active");
$("#ManageUnitID").addClass("active").parents(".nav li").addClass("active open");
});
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.