2

我想知道当 ng-switch-when 和 ng-class 在与此示例中相同的元素上使用时是否没有兼容性问题。

我正在尝试动态更改这四个元素的类,但由于某些原因,这不适用于所有元素,仅适用于当前显示的元素。

有谁知道这里发生了什么?

<div>
    <div ng-switch="sw" ng-init="sw=1">
        <div ng-switch-when="1" ng-class="oneClassOrAnother()"></div>
        <div ng-switch-when="2" ng-class="oneClassOrAnother()"></div>
        <div ng-switch-when="3" ng-class="oneClassOrAnother()"></div>
        <div ng-switch-when="4" ng-class="oneClassOrAnother()"></div>
    </div>
    <div>
        <button ng-click="goTo(1)">1</button>
        <button ng-click="goTo(2)">2</button>
        <button ng-click="goTo(3)">3</button>
        <button ng-click="goTo(4)">4</button>
    </div>
</div>

在 div 之间切换。

$scope.goTo = function(x) {
    $scope.sw = x;
}

返回一门课或另一门课。

$scope.oneClassOrAnother= function() {
    if (...) return "class1";
    else return "class2";
}

非常感谢。

4

2 回答 2

1

看起来您没有正确使用 ng-class 语法。尝试这样的事情:

<div ng-class="{class1: oneClassOrAnother()}" ng-switch-when="1">1</div>

其中 oneClassOrAnother() 返回真或假,“class1”是类的名称。

这是一起使用 ng-class 和 ng-switch-when 的工作示例:http ://plnkr.co/edit/n86SKEktRcPnBy05o8eZ?p=preview

Angular ngClass 文档:https ://docs.angularjs.org/api/ng/directive/ngClass

于 2015-07-21T16:08:46.113 回答
1

我认为你的代码一切都很好,看看这个 plunk,我复制了它并且它的工作。将此与您的代码进行比较,也许您忘记了控制器?

http://plnkr.co/edit/Lz7L3S?p=preview

我猜唯一的区别是我sw从控制器而不是视图启动的事实。

<div ng-switch on="sw">

于 2015-07-21T16:30:40.297 回答