jea*_*arc 2 indexof multidimensional-array angularjs ng-class
所以,我有这个嵌套数组,我无法修改其结构.我想检查键/值对是否存在,如果存在,则将相应的类添加到相关元素中.
我一直试图使用表达式的变体:
ng-class="{ 'active' : data.indexOf('"name":"john"') >= 0 }"
然而,我的表达有点复杂,我担心这样使用太多了.还有使用两个以上级别嵌套引号的问题.
这是一个使用与我正在使用的结构类似的数组的小提琴:
http://jsfiddle.net/5tvmL2Lg/2/
HTML:
<body ng-app="myModule">
<div ng-controller="myController">
<div ng-repeat="hero in heroes">
<div ng-class="{ 'weight-\'hero.stats.indexOf('\'type\':\'weight\'').value\'' : hero.stats.indexOf('\'type\':\'weight\'') >= 0 }">
hello
</div>
</div>
</div>
</body>
JS:
var myModule = angular.module('myModule', []);
myModule.controller('myController', ['$scope', function($scope) {
$scope.heroes = [{
"firstname" : "clark",
"lastname" : "kent",
"stats" : [
{
"type" : "height",
"value" : "6'2"
},
{
"type" : "weight",
"value" : 220
},
{
"type" : "hair",
"value" : "brown"
}
]},
{
"firstname" : "bruce",
"lastname" : "wayne",
"stats" : [
{
"type" : "height",
"value" : "6'1"
},
{
"type" : "hair",
"value" : "black"
}
]},
{
"firstname" : "peter",
"lastname" : "parker",
"stats" : [
{
"type" : "height",
"value" : "5'11"
},
{
"type" : "weight",
"value" : 180
},
{
"type" : "hair",
"value" : "auburn"
}
]}];
}]);
最后的目标是为"克拉克肯特"div添加一个名为"weight-220"的类,没有"bruce wayne"div的类,以及peter parker div的"weight-180".
我知道我的问题很复杂,但任何帮助都会非常感激...... :)
您无需将所有代码逻辑添加到您的ng-class.您可以通过使用返回字符串的函数使其更复杂(以检查深层嵌套的对象):
<div ng-repeat="hero in heroes">
<div ng-class="ClassBuilder(hero)">
hello
</div>
</div>
在您的控制器中,添加此功能:
$scope.ClassBuilder = function(hero) {
for (var i = 0; i < hero.stats.length; i++) {
if (hero.stats[i].type == "weight") {
return "weight-" + hero.stats[i].value;
}
}
}
这hero将从每个接收对象ng-repeat并检查weight类型是否存在.如果是这样,它将使用相应的value以您请求的格式返回一个字符串,例如:"weight-220".否则,它将不返回任何内容,也不会对其应用任何类<div>.
| 归档时间： |
|
| 查看次数： |
778 次 |
| 最近记录： |