渲染后未设置 Reactive Radio

Question

所以基本上就是这样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，它也能正常工作。

我不知道还有什么地方会出错。

更新：

我在不同的 starter

上测试过它

也不行。

组件看起来像

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'
    });
  }
}

Answer 1

我终于明白了。 2天。这是困难的一个。我不认为这是可能的。显然，这是 @ng-bootstrap

的一个已知问题

这里是 plunker 再说一遍。

@NgModule({
  imports: [ 
    BrowserModule,ReactiveFormsModule,    
    NgbModule.forRoot() ],
  declarations: [ App ],
  bootstrap: [ App ]
})

渲染后未设置 Reactive Radio

Reactive Radio doesn't get set after render

angular

angular-reactive-forms