首先，这个问题可以用很多方法解决。这种方法可能不是最优雅的，但可以肯定地起作用。
这是一个简单的解决方案，您应该可以将其添加到任何项目中。您可以在配置可用于注销的路由时仅添加“ pageKey”或其他属性。另外，您可以在$ route对象的$ routeChangeSuccess方法上实现一个侦听器，以侦听路由更改的成功完成。
当处理程序触发时，您将获得页面密钥，并使用该密钥来查找该页面需要为“ ACTIVE”的元素，然后应用ACTIVE类。
请记住，您需要一种使所有元素“处于活动状态”的方法。如您所见，我在导航项上使用.pageKey类将其全部关闭，而在使用.pageKey_ {PAGEKEY}分别将其打开。将它们全部切换为非活动状态将被认为是一种幼稚的方法，通过使用先前的路由仅使活动项目处于非活动状态，可能会获得更好的性能，或者可以将jquery选择器更改为仅选择活动项目为非活动状态。使用jquery选择所有活动项可能是最好的解决方案，因为它可以确保在当前路由中清除所有内容，以防在以前的路由中出现任何CSS错误。
这将意味着更改以下代码行：
$(".pagekey").toggleClass("active", false);
到这个
$(".active").toggleClass("active", false);
这是一些示例代码：
给定一个引导导航栏
<div class="navbar navbar-inverse">
<div class="navbar-inner">
<a class="brand" href="#">Title</a>
<ul class="nav">
<li><a href="#!/" class="pagekey pagekey_HOME">Home</a></li>
<li><a href="#!/page1/create" class="pagekey pagekey_CREATE">Page 1 Create</a></li>
<li><a href="#!/page1/edit/1" class="pagekey pagekey_EDIT">Page 1 Edit</a></li>
<li><a href="#!/page1/published/1" class="pagekey pagekey_PUBLISH">Page 1 Published</a></li>
</ul>
</div>
</div>
还有一个角度模块和控制器，如下所示：
<script type="text/javascript">
function Ctrl($scope, $http, $routeParams, $location, $route) {
}
angular.module('BookingFormBuilder', []).
config(function ($routeProvider, $locationProvider) {
$routeProvider.
when('/', {
template: 'I\'m on the home page',
controller: Ctrl,
pageKey: 'HOME' }).
when('/page1/create', {
template: 'I\'m on page 1 create',
controller: Ctrl,
pageKey: 'CREATE' }).
when('/page1/edit/:id', {
template: 'I\'m on page 1 edit {id}',
controller: Ctrl, pageKey: 'EDIT' }).
when('/page1/published/:id', {
template: 'I\'m on page 1 publish {id}',
controller: Ctrl, pageKey: 'PUBLISH' }).
otherwise({ redirectTo: '/' });
$locationProvider.hashPrefix("!");
}).run(function ($rootScope, $http, $route) {
$rootScope.$on("$routeChangeSuccess",
function (angularEvent,
currentRoute,
previousRoute) {
var pageKey = currentRoute.pageKey;
$(".pagekey").toggleClass("active", false);
$(".pagekey_" + pageKey).toggleClass("active", true);
});
});
</script>