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中的错误
使用 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与您要比较的内容完全相等。
| 归档时间: |
|
| 查看次数: |
16308 次 |
| 最近记录: |