AngularJS中发生路由更改时如何设置ngclass更改？

Question

当路由发生变化时，我正在尝试在我的主 .container 类上添加一个类。

我目前的简单解决方案包括在每个主菜单 url 上都有一个 ng-click（页面上没有其他 url）：

app.controller('MainCtrl', ['$scope', function( $scope ){

  $scope.setMain = function( value ){ $scope.isMain = value };

}]);

然后在我的html中：

<div ng-controller="MainCtrl" class="container" ng-class="{'main': isMain}">
  <ul class="main-menu">
    <li><a href="#" ng-click="setMain(true)"></li>
    <li><a href="#/page-1" ng-click="setMain(false)"></li>
    <li><a href="#/page-2" ng-click="setMain(false)"></li>
  </ul>
  <div ng-view></div>
</div>

只要我需要添加更多 url，这似乎可以正常工作，问题是当用户不点击任何链接并直接访问他没有获得主类的 url 时。

有没有更好的方法来做到这一点？

Answer 1

您可以使用几个不同的选项，但我认为最简单的方法是通过查看 $location 在控制器初始化时设置 $scope.isMain 值。所以在控制器内部你可以有类似的东西：

var loc = $location.path();
if(loc === /* some route rule you require */){
    $scope.isMain = true;
}

看看这里：http://docs.angularjs.org/api/ngRoute/service/$route 作为底部的示例，有几个不同的示例说明您可以访问与路线有关的数据类型。