Question

我正在尝试创建一个ng-class，它根据当前星期几使用JavaScripts getDay（）将tab类设置为“active”，该值将0-6应用于一周中的每一天。因此，如果它是星期一，检查currentDay是否等于1 apply class，如果它是星期二的选项卡检查currentDay，如果它等于2则将该类应用于星期二等，例如：

Javascript （我尝试将其放入我的控制器中的$ scope对象，但这似乎也不起作用）：

var d = new Date();
var currentDay = d.getDay();

查看

<ul class="nav nav-tabs">
 <li ng-class="{'active' : currentDay == 4}">
   <a href="schedule/#thursday" data-toggle="tab">
     <h2>Day 1 | Thursday</h2>
   </a>
 </li>
 <li>
   ...
 </li>
</ul>

我尝试了多种不同的方法让它发挥作用。如果我在控制台中检查currentDay == 4（因为今天是星期四），它将返回为“true”。所以应该应用这个类。我也试过没有''活跃，并把条件放在[]。似乎没什么用。感谢任何输入，谢谢！

Answer 1

上面的代码对我有用。这是一个示例小提琴：http://jsfiddle.net/HB7LU/3252/

控制器：

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.currentDay = 4;
}

查看：

<div ng-controller="MyCtrl">
    <ul class="nav nav-tabs">
        <li ng-class="{'active' : currentDay == 4}">
            <a href="schedule/#thursday" data-toggle="tab">
                <h2>Day 1 | Thursday</h2>
            </a>
        </li>
    </ul>
</div>

如果我不得不猜测，您没有正确地将值应用于$scope

Answer 2

我能搞清楚了！

所以在控制器中我添加了下面的最后一行

var d = new Date();
var currentDay = d.getDay();
$scope.activeDay = currentDay;

并将视图更新为：

<li ng-class="{'active' : activeDay == 4}">

Angular：根据变量值创建ng-class

2 个答案: