如何与ng-class中的字符串进行比较?

orb*_*ory 4 angularjs ng-class

这条线似乎对我不起作用.

Sort By: <a href="" ng-click="setOrder('title')" ng-class="{active: orderProp == 'title'}">Alphabetical</a>
Run Code Online (Sandbox Code Playgroud)

我必须以某种方式逃离orderProp =='title'中的'title'吗?

在控制器中我有

...
$scope.orderProp = 'title';
$scope.setOrder = function(sortBy){
            $scope.orderProp = sortBy;
}
...
Run Code Online (Sandbox Code Playgroud)

谢谢

更新: 使用v1.3.0-beta.17

添加 ng-class="{active:orderProp=='pagetitle'}

<a href="" ng-click="setOrder('pagetitle')" ng-class="{active:orderProp=='pagetitle'}">Alphabetical</a>
Run Code Online (Sandbox Code Playgroud)

抛出错误

"Error: [$parse:syntax] http://errors.angularjs.org/1.3.0-beta.17/$parse/syntax?p0=undefined&p1=not%20a%20primary%20expression&p2=null&p3=%7Bactive%3AorderProp%3D%3D&p4=%7Bactive%3AorderProp%3D%3D
Run Code Online (Sandbox Code Playgroud)

对不起,我提出错误的方式,但我刚开始角度上周,并不知道更好的方法

更新2: 错误似乎来自= == ===.我试过>并没有发生错误.是否有类似eq的替代语法?

用解决方案更新3

我将每个字符串映射到一个int pagetile-> 1 code-> 2 + data-ng-class ="{active:orderPropIdx == 1};" 如果pagetitle设置为active:orderPropIdx为1,依此类推

也许这是角度1.3中的错误

Nop*_*pey 7

正如评论中所述,您的班级名称应该用单引号括起来.

ng-class="{'active': orderProp == 'title'}">

此比较区分大小写.


Dan*_*ana 5

使用 ng-class 时遇到了同样的问题。即使表达式已成功计算,它也拒绝动态计算类属性。

这是我用于 ng-class 语句的解决方法:

Sort By: <a href="" ng-click="setOrder('title')" class="{{orderProp == 'title' ? 'active' : ''}}">Alphabetical</a>
Run Code Online (Sandbox Code Playgroud)

而不是ng-class="{active: orderProp == 'title'}我已经切换到class="{{orderProp == 'title' ? 'active' : ''}}"


jcc*_*jcc -3

ng-class 的语法有时会非常混乱。尝试这个。

ng-class="{true: 'active', false: ''}[orderProp === 'title']"
Run Code Online (Sandbox Code Playgroud)

在大括号后面包含方括号。在方括号内,您可以声明任何表达式,并声明您的结果(真/假)和您想要应用的相应类(活动)。并且一定要在表达式中使用“===”,表示您希望 orderProp与您要比较的内容完全相等。