Question

我有一个主页，其中有侧边栏菜单项和页脚。我在其他页面中使用此侧边栏。我登录仪表板菜单后突出显示它因为我正在激活它。但是点击其他链接后我怎么能使该菜单处于活动状态，因为我使用的是所有页面常用的侧边栏。有什么方法可以动态地完成它吗？或者我是否必须在每个页面中复制以下代码并使特定菜单项处于活动状态？

    <div class="col-xs-12 col-sm-12 col-md-12">
    <div class="LeftMenu">
    <ul>
    <a href="#!/admindashboardhome" title="Dashboard"><li 
    class="Active"><span class="glyphicon glyphicon-th"></span>
    <span>Dashboard</span></li></a>
    <a href="#!/examinationhalltickets" title="Declaration"><li><span
    class="glyphicon glyphicon-barcode"></span><span>Examination
    Form</span></li></a>
    <a href="#!/collegedetails" title="Declaration"><li><span 
    class="glyphicon glyphicon-education"></span><span>College 
    Details</span></li></a>
    <a href="#!/studentdetails" title="Declaration">
    <li><span class="glyphicon glyphicon-user"></span><span>Student
    Details</span></li></a>
    </ul>
    </div>
    </div>

Answer 1

这应该可以解决问题

HTML：

<a ng-class="getClass('/admindashboardhome')" href="/admindashboardhome">Dashboard</a>

JavaScript的：

$scope.getClass = function (path) {
  return ($location.path().substr(0, path.length) === path) ? 'active' : '';
}

CSS：

.active {
  //styling
}

动态地将侧栏菜单激活

1 个答案: