带有禁用行的 ng-options [英] ng-options with disabled rows
问题描述
是否可以使用 ng-options 来根据条件呈现为禁用的行?
这个:
也许可以变成这样:
假设通过一个过滤器可以为所有具有 shade = "dark" 的颜色返回 disabled='disabled'
@lucuma 的答案(最初被接受的答案)是正确的，但现在应该更新，因为这已在 Angular 1.4 中修复.请参阅 ng-options 的文档，其中还包含一个 example.
我使用的是 Angular 1.5，这对我有用:
查看
<select ng-model="$ctrl.selectedItem" ng-options="item as item.label 禁用时 item.disabled for item in $ctrl.listItems">
控制器
vm.items = [{ id: 'optionA', 标签: 'Option A' },{ id: 'optionB', label: 'Option B (recommended)' },{ id: 'optionC', label: 'Option C (Later)', 禁用: true }];vm.selectedItem = vm.items[1];
Is it possible to use ng-options that it will render into disabled rows based on criteria?
this:
<select ng-options="c.name group by c.shade for c in colors">
maybe possible to turn into something like this:
<select ng-options="c.name group by c.shade for c in colors | disabled(c.shade)">
and let's say via a filter that could return disabled='disabled' for all the colors that have shade = "dark"
<select>
<optgroup label="dark">
<option value="0" disabled="disabled">black</option>
<option value="2" disabled="disabled">red</option>
<option value="3" disabled="disabled">blue</option>
</optgroup>
<optgroup label="light">
<option value="1">white</option>
<option value="4">yellow</option>
</optgroup>
</select>
@lucuma's answer (originally the accepted answer) was correct, but by now should be updated, because this was fixed in Angular 1.4. See the docs of ng-options which also contains an example.
I'm using Angular 1.5 and this works for me:
View
<select ng-model="$ctrl.selectedItem" ng-options="item as item.label disable when item.disabled for item in $ctrl.listItems">
Controller
vm.items = [
{ id: 'optionA', label: 'Option A' },
{ id: 'optionB', label: 'Option B (recommended)' },
{ id: 'optionC', label: 'Option C (Later)', disabled: true }
];
vm.selectedItem = vm.items[1];
这篇关于带有禁用行的 ng-options的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
