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

将payedOvertime: [false, Validators.required]更改为payedOvertime: [null, Validators.required]。

假设您将其设置为false，它会匹配模板中No单选按钮的值，并默认选择它（正确地说是这样）。将其设置为null将阻止Angular将该值与模板中声明的任何值匹配，因此将不会选择这些单选按钮。

Answer 2

仅将Validators.required更改为Validators.requiredTrue，像这样：

payedOvertime: [false, Validators.requiredTrue]

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

2 个答案: