Question

在ngModel的示例中，我有两个单选按钮。

s.loadData('data.csv');

当我传递布尔变量时，它不起作用。

<div id="container">
    <input type="radio" id="radiobuttonstoerung1" label="Blinkend" name="stoerungBlinkend" [(ngModel)]="project.modelvalue"
          value="true"/>
    <input type="radio" id="radiobuttonstoerung2"  label="Dauersignal" name="stoerungBlinkend" [(ngModel)]="project.modelvalue"
  value="false"/>
</div>

示例链接： https://stackblitz.com/edit/angular-cxt8bs-quvb7y?file=radiobutton.html

方案当我将'stoerungBlinkend'传递为true时，应检查value =“ true”的RadioButton。如果我将其传递为false，则应检查值为=“ false”的RadioButton。

我已经找到了解决方法，但是没有人能详细解释为什么上述情况不起作用吗？

Answer 1

如Angular documentation中所述，当您使用value="true"设置单选按钮值时，实际上是将值设置为字符串"true"，与布尔值{ {1}}。

要在输入元素上设置布尔值，请对true使用属性绑定：

[value]="true"

有关演示，请参见this stackblitz。

Answer 2

尝试这样的事情：

您的TS：

    form: FormGroup;
constructor(fb: FormBuilder) {
    this.name = 'Angular2'
    this.form = fb.group({
            gender: ['', Validators.required]
});
}

HTML：

<form [formGroup]="form">
    <input type="radio" value='Male' formControlName="gender" >Male
    <input type="radio" value='Female' formControlName="gender">Female
</form>

RadioButton ngmodel不适用于布尔值

2 个答案: