所以基本上它就像这个plunker
<form [formGroup]="form">
<div class="form-control" *ngFor="let item of foods">
<input type="radio" formControlName="food" value="{{item}}"> {{item}}
</div>
</form>
一个非常简单的反应形式。
但是,当我将确切的代码放入我的实际项目中时。它不起作用。
我可以看到它正在尝试将选中的属性设置为 true
在这一行this._renderer.setElementProperty(this._elementRef.nativeElement, 'checked', this._state);
但它不会在加载后在屏幕上标记为已选中。
如果我将类型更改为复选框,它工作正常。
如果我使用 ngModel,它也可以正常工作。
我不知道还有什么问题。
更新:
我在不同的启动器上对其进行了测试
它也不起作用。
该组件看起来像
import { FormBuilder } from '@angular/forms';
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-test',
template: `
<form [formGroup]="form">
<div *ngFor="let x of foods">
<input type="radio" value="{{x}}" formControlName="food"> {{x}}
</div>
</form>
`,
styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {
form;
foods = ['beef', 'lamb', 'fish'];
constructor(private _FormBuilder: FormBuilder
) { }
ngOnInit() {
this.form = this._FormBuilder.group({
food: 'lamb'
});
}
}