Angular2,如果没有选择复选框来禁用按钮 [英] Angular2, disable button if no checkbox selected
本文介绍了Angular2,如果没有选择复选框来禁用按钮的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有多个复选框和具有如果选择的至少一个复选框只启用一个按钮
I have multiple checkboxes and a button that has to be enabled only if at least one checkbox is selected
<input type="checkbox">VALUE1
<input type="checkbox">VALUE2
<input type="checkbox">VALUE3
<input type="checkbox">VALUE4
<button>Proceed</button>
这是如何实现使用Angular2。
How is this achieved using Angular2.
的 P.S:发现了类似的问题,但没有使用Angular2 的
推荐答案
一种方法是使用 ngModel
每个复选框,然后控制按钮的
One way is to use ngModel
on each checkbox, then control the button's disabled
property via a method that examines each checkbox model state:
@Component({
template: `
<label *ngFor="#cb of checkboxes">
<input type="checkbox" [(ngModel)]="cb.state">{{cb.label}}
</label>
<p><button [disabled]="buttonState()">button</button>
`
})
class App {
checkboxes = [{label: 'one'},{label: 'two'}];
constructor() {}
buttonState() {
return !this.checkboxes.some(_ => _.state);
}
}
<大骨节病> Plunker 骨节病>
这篇关于Angular2,如果没有选择复选框来禁用按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文