我在AngularJS设置了如下路由:
$routeProvider
.when('/dashboard', {templateUrl:'partials/dashboard', controller:widgetsController})
.when('/lab', {templateUrl:'partials/lab', controller:widgetsController})
我在顶部栏上有一些样式为选项卡的链接.如何根据当前模板或URL将"活动"类添加到选项卡中？
解决此问题而不必依赖URL的一种方法是在$routeProvider个配置期间 for each 部分添加一个自定义属性，如下所示:
$routeProvider.
when('/dashboard', {
templateUrl: 'partials/dashboard.html',
controller: widgetsController,
activetab: 'dashboard'
}).
when('/lab', {
templateUrl: 'partials/lab.html',
controller: widgetsController,
activetab: 'lab'
});
在控制器中显示$route:
function widgetsController($scope, $route) {
$scope.$route = $route;
}
根据当前活动选项卡设置active类:
<li ng-class="{active: $route.current.activetab == 'dashboard'}"></li>
<li ng-class="{active: $route.current.activetab == 'lab'}"></li>