Question

我有一个菜单控制器，如下所示：

apoSoft.controller("MenuCtrl", function($scope, $location) {
  $scope.menuClass = function(page) {
    var current = $location.path().substring(1);
    return page === current ? "active" : "";
  };
});

我的菜单片段如下：

<ul class="nav navbar-nav">
    <li ng-class="menuClass('usercreate')">
        <a href="#!/usercreate">Create User</a>
    </li>
</ul>

这适用于主菜单。但现在我需要的是，如果我导航到一个子菜单，相关的主菜单仍应突出显示。我需要这样的东西：

...
<li ng-class="menuClass('usercreate or usercreateresponse')">
...

但这当然不起作用。有谁知道如何解决这个问题？非常感谢！

Answer 1

不是在菜单上多次调用该函数，而是可以使用一个事件监听器来改变范围变量。我不确定你使用的是什么路由器，所以现在假设ngRoute

$scope.$on('$routeChangeSuccess', function(}(
    $scope.path = $location.path().substring(1);
});

然后在ng-class内使用对象语法

<li ng-class="{active: path=='usercreate' || path == 'usercreateresponse'}">

AngularJS SubMenu突出显示

1 个答案: