使用ngModel进行Angular 2单选按钮验证 [英] Angular 2 Radio Button Validation with ngModel
本文介绍了使用ngModel进行Angular 2单选按钮验证的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
Angular 2的文档介绍了表单验证.但仅对于输入字段,请输入文本.我的问题是单选按钮.
Angular 2's documentation tells about the form validation. But only for input fields type text. My question is for Radio Buttons.
这是HTML:
<input type="radio" required name='gender' value='Male' [(ngModel)]='gender'>Male
<input type="radio" required name='gender' value='Female' [(ngModel)]='gender'>Female
<button type='button' [disabled]="??">Next<button>
如果用户未选择任何值,如何将Disabled属性设置为true.
How to set disabled property to true if user hasn't selected any value.
推荐答案
使用模板驱动的表单,您可以将模型暴露给局部变量并查询错误对象.
With template driven forms you can expose your model to a local variable and query the errors object.
<form #f="ngForm">
<input type="radio" value="male" name="gender" [(ngModel)]="gender" required #genderControl="ngModel"> Male
<input type="radio" value="female" name="gender" [(ngModel)]="gender" required> Female
<button [disabled]="genderControl.errors">Next</button>
</form>
export class App {
gender = null;
}
这篇关于使用ngModel进行Angular 2单选按钮验证的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文