为什么不能在带有条件的ng类中使用方法
Why one cannot use a method in ng-class with condition?
我在显示文本的ng-repeat
上有一个简单的loop
。此外,我想要列表中的一个项目,该项目应为活动(通过使用绿色突出显示),因为我已将variable
设置为该项目的一个id
的值。
当使用以下语法进行比较时,这确实很有效:
<div ng-repeat="item in data" ng-class="{'active': item.id == selectedId">
但当我尝试合并一个方法时,它只是失败了,并给出控制台错误。
请在这里找到演示。
代码如下:
HTML:
<div ng-app="app" ng-controller="test">
<div ng-repeat="item in data" ng-class="{'active': getSelectedItemActive(item.id)">
{{item.name}}
</div>
</div>
JS:
var app = angular.module('app', []);
app.controller('test', function($scope) {
$scope.data = [{
'id': 1,
'name': 'text 1'
}, {
'id': 2,
'name': 'text 2'
}, {
'id': 3,
'name': 'text 3'
}, {
'id': 4,
'name': 'text 4'
}, {
'id': 5,
'name': 'text 5'
}];
$scope.selectedId = 3;
$scope.getSelectedItemActive = function(id){
return id == $scope.selectedId;
}
});
CSS:
.active {
color: green;
}
您忘记关闭模板中的表达式("}"):
<div ng-repeat="item in data" ng-class="{'active': getSelectedItemActive(item.id)">
应该是
<div ng-repeat="item in data" ng-class="{'active': getSelectedItemActive(item.id)}">
更新的fiddle
ng类中缺少一个结束大括号。
试着用这个,效果很好。
错误消息不言自明-
VM59 angular.js:9101错误:[$parse:syntax]语法错误:令牌"undefined"是意外的,在表达式[{'active':getSelectedItemActive(item.id)]开始于[{'active':getSelectedItemActive(item.id)].
错过"}"
<div ng-repeat="item in data" ng-class="{'active': getSelectedItemActive(item.id)}">
相关文章:
- AngularJS-ng使用字符串索引在数组上重复
- ng-使用重复条目重复重复数据
- 使用方法将扫描的项目添加到总数中
- D3使用方法链接时的不同行为
- 如何在不链接/jquery的情况下使用方法应用css属性数组
- 胸腺价值发送angularJS ng onclick方法
- JQuery AJAX - 如何使用方法 GET 调用刷新/重新加载页面
- 在Javascript中使用C#方法
- ng使用ui视图制作动画
- 可以'使用方法帖子时,不要提交ajaxForm
- ng使用angular中的json数据使用optgroup重复select
- ng使用一个不识别临时变量形式ng repeat的函数绑定html
- NG使用过滤器重复比较当前日期
- 为什么不能在带有条件的ng类中使用方法
- http模块(node.js和browserfy的)没有't使用方法PATCH写入请求正文
- ng使用UI引导指令绑定html
- 在 javascript 中使用方法的局部变量
- 使用方法和属性定义javascript对象的最佳方法是什么?(如果可能以本机方式)
- 无法使用方法调用 meteor 包中的函数
- 405:不允许使用方法(AJAX 查询到 Flask)