内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用
我有一个表格,其中一个列中有一个复选框。选中复选框后,我将该行推入数组。
我试图用下面的..real world示例更好地解释这个
该表可以包含重复id的行(row(flat_id
)的列不同)。我上面提到的重复ID是user_map_id
。
当我检查(单击复选框)一行时,我希望user_map_id
禁用其他行。
因此,当检查一行时,我将user_map_id
s 存储在一个数组中。然后我这样做:
ng-disabled="selectedUserMapIdArray.indexOf(flat.user_map_id) >= 0
即如果user_map_id
数组中存在选定的user_map_id
s ,则禁用该行,但这会禁用我检查的那个,如果我愿意,我也无法取消选中它。
所以我也将数据推入flat_id
数组并执行此操作:
ng-disabled="selectedUserMapIdArray.indexOf(flat.user_map_id) >= 0 && selectedFlatNumArray.indexOf(flat.flat_id) < 0 "
即禁用行,如果该行的user_map_id
是存在于selectedUserMapIdArray
(其存储user_map_id
)阵列和在不存在selectedFlatNumArray
(其存储flat_id
)
但现在当我检查有特定的行flat_id
是常见的有重复的一个user_map_id
,flat_id
,然后再在该组中二选一,一个与普通flat_id
没有得到禁用,因为flat_id
我在上面签是存在于selectedFlatNumArray
(其中存储flat_id
)。
解释现实世界
这是一个截图:
表中的行是业主和占用者的列表(两者都有user_map_id
)。公寓业主可以有多个单位(因此user_map_id
表中有副本)。公寓业主可以有多个单位(不同flat_ids
)。
但是公寓老板可以有一个占用者(同样flat_id
不同user_map_id
)。乘客可以居住在公寓业主的许多公寓之一(相同的flat_id
不同user_map_id
)。
我想能够检查任何一个公寓老板(其他人被禁用)和一个占用者(如果我想)。
如果我检查平面所有者的一个平面的行,属于同一个平面所有者的其他行被禁用并且正常工作。
但是当我检查一个占用者的行,然后再次检查该占用者的一个扁平所有者(它没有相同flat_id
)时,具有相同行的flat_id
行将不会被禁用,因为flat_id
它存在于selectedFlatNumArray
(存储flat_id)
我该怎么做呢?
表:
<tbody>
<tr ng-repeat="flat in someObj.flatsArray | filter:searchFlat">
<td>{{ flat.occupant_name || flat.owner_name}}</td>
<td>{{flat.flat_no}}</td>
<td class="text-center">
<input class="" name="{{flat.flat_no}}" ng-attr-title="{{(selectedUserMapIdArray.indexOf(flat.user_map_id) >= 0 && selectedFlatNumArray.indexOf(flat.flat_id) < 0) ? 'This user has been already invited' : ''}}"
ng-disabled="selectedUserMapIdArray.indexOf(flat.user_map_id) >= 0 && selectedFlatNumArray.indexOf(flat.flat_id) < 0 "
type="checkbox" ng-change="checkChanged(flat.isChecked, flat)" ng-model="flat.isChecked" />
</td>
</tr>
</tbody>
我觉得你ng-disabled
和你的ng-title
应该简化,以便更容易理解。我建议删除你的数组并迭代你的原文,看看它是否符合你的条件flat
。调试和避免错误会更容易。
<input name="{{flat.flat_no}}"
ng-attr-title="{{flat.title}}"
ng-disabled="flat.isDisabled"
type="checkbox"
ng-change="flatChange(flat)"
ng-model="flat.isChecked" />
当您更改复选框以对其他单位进行更改时,我建议迭代您的对象。请注意,这是未经测试的代码,可能需要一些调整
$scope.flatChange = function(changedFlat) {
$scope.someObj.flatsArray.forEach(function(flat) {
if (changedFlat.checked) {
if (flat.user_map_id === changedFlat.user_map_id && flat.flat_id !== changedFlat.flat_id) {
if (changedFlat.idChecked) // If flat is checked, uncheck each one with the same `user_map_id` but not the same `flat_id`.
flat.isChecked = false;
}
flat.isDisabled = !changedFlat.checked; // `disabled` propriety is the opposite of `checked`.
flat.title = changedFlat.checked
? 'This user has been already invited'
: '';
}
});
};