使用AngularJS。
具有以下JSON片段:
"skills": {
"Charisma": {},
"Dexterity": {
"Sk3": [
[
true,
true,
true,
true,
false
],
44
]
}, ...
以及以下对应的HTML
<div class="panel panel-info" ng-repeat="(key, value) in character.skills | orderBy:'$index':true">
<div class="panel-heading">
<span class="accordion-toggle collapsed" data-toggle="collapse" data-target="#{{key}}">
<header>
<label>{{key}}</label>
</header>
</span>
</div>
<ul id="{{key}}" class="list-group collapse">
<li class="list-group-item" ng-repeat="(K, V) in value">
<input type="checkbox" />
<label>{{K}}</label>
</li>
</ul>
</div> ...
如何重复并将布尔数组绑定到复选框输入? 结果将是每个技能名称前面的5个复选框,取决于布尔值被选中还是未选中。
我尝试了类似的东西:
<li class="list-group-item" ng-repeat="(K, V) in value">
<input type="checkbox" ng-repeat="bool in V[0]" ng-model="V[0]"/>
<label>{{K}}</label>
</li>
但这是不行的..
您可以在这种情况下绑定到布尔数组元素,如下所示:
<input type="checkbox" ng-repeat="bool in V[0] track by $index" ng-model="V[0][$index]" />
请注意,由于数组中存在重复项,因此必须使用track by $index
表达式。另外,您需要使用ngModel
指令。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句