AngularJS - 设置范围中定义的类名

时间:2013-04-08 09:12:28

标签: angularjs

我正在使用AngularJS 1.05

我想要这样的事情:

在我的控制器中:

$scope.location = $location.path().split('/')[2]
$scope.lang = $routeParams.lang
$scope.bodyClassName = ((if $scope.location isnt "login" then "sub" else ""))

我想在文档对象中报告这些变量,例如:

<div class="home en sub"></div>

我试过

<div class="{{location}} {{lang}} {{bodyClassName}}"></div>

它适用于第一次加载,但不适用于视图刷新。

正如文档所说, ng-class 是针对评估表达式的,但我需要打印变量。

有什么好办法?

2 个答案:

答案 0 :(得分:4)

您需要观察$location.path()以获取路线更改并相应地更新范围变量:

$scope.$watch(function() {
  return $location.path();
}, function(newPath) {
  $scope.location = $location.path().split('/')[2]
  $scope.lang = $routeParams.lang
  $scope.bodyClassName = ((if $scope.location isnt "login" then "sub" else ""))
});

然后,在你的标记中,正如你所尝试的那样:

<div class="{{location}} {{lang}} {{bodyClassName}}"></div>

上述的另一个变体是仅在路线更改成功事件上而不是在每个手表中更新范围变量。

答案 1 :(得分:0)

你可以这样做:

<div class="location + ' ' + lang"></div>

,或者

<div class="[ location, lang ].join(' ')"></div>