Javascript Json对象AngularJS
嗯，我需要访问数组中的一些信息，这些信息位于另一个Json格式的数组中 更具体地说：Javascript Json对象AngularJS,javascript,json,angularjs,html,Javascript,Json,Angularjs,Html,嗯，我需要访问数组中的一些信息，这些信息位于另一个Json格式的数组中 更具体地说： [ { "id": 1, "name": "PowerRanger", "description": "BLUE", "connections": [ {"id": 123,"megazordName": "Fer","isSet": true}, {"id": 456,"megazordName": "Alg","isSet": false}
[
{
"id": 1,
"name": "PowerRanger",
"description": "BLUE",
"connections":
[ {"id": 123,"megazordName": "Fer","isSet": true},
{"id": 456,"megazordName": "Alg","isSet": false}
]
},{
"id": 2,
"name": "PowerRanger",
"description": "RED",
"connections":
[ {"id": 789,"megazordName": "Tes","isSet": false},
{"id": 369,"megazordName": "EXp","isSet": true}
]
},{
"id": 3,
"name": "PowerRanger",
"description": "WHITE",
"connections":
[ {"id": 258,"megazordName": "Ref","isSet": false},
{"id": 147,"megazordName": "Mob","isSet": false}
]
}
]
我该怎么做呢？我有一个解决方案，但它不是你想要的100%
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="http://code.angularjs.org/1.2.0/angular.min.js"></script>
<link href="../bootstrap/css/bootstrap.css" rel="stylesheet"/>
<link href="../bootstrap/css/bootstrap-theme.css" rel="stylesheet"/>
<style>
.check-disabled-true {
color: gray
}
.check-disabled-false {
color: black
}
</style>
<script>
angular.module("atpModule", [])
.controller("atpCtrl", function ($scope) {
$scope.selectedPrizemoney = 'Select one';
$scope.isdisabled=true;
$scope.atp = [
{
"id": 1,
"name": "PowerRanger",
"description": "BLUE",
"connections":
[ {"id": 123,"megazordName": "Fer","isSet": true},
{"id": 456,"megazordName": "Alg","isSet": false}
]
},{
"id": 2,
"name": "PowerRanger",
"description": "RED",
"connections":
[ {"id": 789,"megazordName": "Tes","isSet": false},
{"id": 369,"megazordName": "EXp","isSet": true}
]
},{
"id": 3,
"name": "PowerRanger",
"description": "WHITE",
"connections":
[ {"id": 258,"megazordName": "Ref","isSet": false},
{"id": 147,"megazordName": "Mob","isSet": false}
]
}]
$scope.shouldBeDisabled = function (item) {
if (item.connections!= $scope.selectedPrizemoney) {
return true;
} else {
return false;
}
};
});
</script>
</head>
<body>
<div ng-app="atpModule" ng-controller="atpCtrl">
<div id="atpPanel" class="panel">
<h4 class="panel-header">ENABLE/DISABLE CHECKBOXES USING ANGULAR JS</h4>
<hr/>
<h5 class="panel-header">Select the connection:</h5>
<select ng-model="selectedPrizemoney" ng-options=" items.megazordName for items in atp[0].connections">
<option value="" disabled="">Select one</option>
</select>
<hr/>
<div ng-repeat="item in apt.connections">
<p class="check-disabled-{{shouldBeDisabled(item)}}">
<input type="checkbox" name="{{item.megazordName}}"
value="{{item.megazordName}}" ng-disabled="shouldBeDisabled(item)">{{item.megazordName}}
</p>
</div>
</div>
</div>
</body>
</html>
.检查是否为真{
颜色：灰色
}
.检查是否禁用false{
颜色：黑色
}
角度模块（“atpModule”，[]）
.控制器（“atpCtrl”，功能（$scope）{
$scope.selectedPrizemoney='selectone'；
$scope.isdisabled=true；
$scope.atp=[
{
“id”：1，
“名称”：“PowerRanger”，
“说明”：“蓝色”，
“联系”：
[{“id”：123，“megazordName”：“Fer”，“isSet”：true}，
{“id”：456，“megazordName”：“Alg”，“isSet”：false}
]
},{
“id”：2，
“名称”：“PowerRanger”，
“说明”：“红色”，
“联系”：
[{“id”：789，“megazordName”：“Tes”，“isSet”：false}，
{“id”：369，“megazordName”：“EXp”，“isSet”：true}
]
},{
“id”：3，
“名称”：“PowerRanger”，
“说明”：“白色”，
“联系”：
[{“id”：258，“megazordName”：“Ref”，“isSet”：false}，
{“id”：147，“megazordName”：“Mob”，“isSet”：false}
]
}]
$scope.shouldBeDisabled=功能（项）{
if（item.connections！=$scope.selectedPrizemoney）{
返回true；
}否则{
返回false；
}
};
});
使用ANGULAR JS启用/禁用复选框
选择连接：
选择一个
{{item.megazordName}