我在表格中使用ng-model时遇到了一些问题。表是根据我使用RESTful API服务从服务器获得的数据构建的,以下是我正在使用的数据的详细信息:
insurancePlans
数组内insuranceItems
数组内注意:每个保险计划都有保险项目清单!
以下是HTML代码:
<table class="table" ng-init="$parent.getInsurancePlans();$parent.getInsuranceItems()">
<colgroup>
<col>
<col ng-repeat="plan in $parent.insurancePlans" class="ng-class: $parent.selectedCol==$index ? 'selected-col' : ''">
</colgroup>
<thead>
<th></th>
<th class="centered-cell" ng-repeat="plan in $parent.insurancePlans">{{plan.name}}</th>
</thead>
<tbody>
<tr ng-repeat="item in $parent.insuranceItems track by $index">
<td>{{item.name}}</td>
<td class="centered-cell" ng-repeat="plan in $parent.insurancePlans track by $index" ng-click="$parent.setSelectedColumn($index)">
<img src="images/check.png" ng-show="$parent.showImg(plan.insuranceItems, item)"></img>
<input contenteditable type="checkbox" checklist-model="selectedOptionalItems" checklist-value="item" ng-show="$parent.showCheckBox(item,plan)" id="optional-insurance-plans" name="optionalInsurancePlans"/>
<select contenteditable ng-model="selectedFranchiseOption[$parent.$index]" ng-show="$parent.showSelectOptions(plan,plan.insuranceItems, item)" class="form-control" name="franchise-options" id="franchise-options" required>
<option value="">0</option>
<option value="{{item.franchise/2}}">{{item.franchise/2}}</option>
<option value="{{item.franchise}}">{{item.franchise}}</option>
</select>
<div ng-show="$parent.showFranchise(plan,plan.insuranceItems, item)" name="franchise" id="franchise">{{item.franchise}}</div>
</td>
</tr>
</tbody>
</table>
这些ng-show
属性是有原因的,但您不需要关注它们,因为我100%确定它们与我遇到的问题无关。
这是表格的初始外观。现在,请注意 PRIVILEGE Insurnace计划具有与最后4个保险项目相关联的复选框,这意味着每个保险项目对于与该项目相关联的每个保险计划都是可选的。
Juridic protection
以了解保险计划PRIVILAGE A
,请执行以下操作:我知道我正在使用嵌套的ng-repeat,并且每个包含当前保险项checklist-model="selectedOptionalItems"
的保险计划将被共享,换句话说,同一行内的所有元素都将填充相同的值。当我选择下拉菜单中的一个选项时,会发生同样的事情。这是一个问题的图片以及:
{{0}}
任何形式的帮助将不胜感激,谢谢你提前!