好吧,我需要以 Json 格式访问另一个数组内的数组内的一些信息。
像这样更具体:
[
{
"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}
]
}
]
而且我需要在仅选择一个时禁用所有“megazordName”(更具体地说是使用复选框)。
需要一些帮助:)
这是 plunker 。
我该怎么做?
我有一个解决方案,但它不是您想要的 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>