FormControl布尔值,在角度2中没有默认值

Question

我在角度2(4.1.2)中使用反应形式

我有一个布尔属性,我不想有一个默认值,但它应该是必需的.

这就是我创建表单的方式:

constructor(private fb: FormBuilder) {
    this.form = this.fb.group({
        payedOvertime: [false, Validators.required],
    });
}

而我的HTML:

<div class="form-group">
    <label>Payed overtime</label>
    <label>
        <input type="radio" name="payedOvertime" formControlName="payedOvertime" [value]="true" />Yes
    </label>
    <label>
        <input type="radio" name="payedOvertime" formControlName="payedOvertime" [value]="false" />No
    </label>
</div>

问题在于,虽然这可以预先选择无线电按钮,但我不想这样,而是必须通过单击其中一个无线电按钮来选择它.如果没有单击任何单选按钮,我希望表单无效.

Answer 1

只需更改Validators.required为Validators.requiredTrue，例如：

payedOvertime: [false, Validators.requiredTrue]

Answer 2

更改payedOvertime: [false, Validators.required]到payedOvertime: [null, Validators.required].

鉴于您将其设置为false,它与No模板中的单选按钮的值匹配,并且默认情况下选择它(正确地说是这样).将其设置为null将阻止Angular将值与模板中声明的任何值匹配,因此将选择非这些单选按钮.