AngularJS SubMenu突出显示

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中使用object语法

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