angular 2 Reactiveforms无线组无法加载

Question

我想创建一个带有两个单选按钮组的窗体，但在屏幕上没有任何东西，控制台也没有错误。

<div class="portlet light bordered"> 
     <form [formGroup]="serversMachinesFormGroup" class="form" *ngIf="serversMachinesFormGroup"> 
      <div [formGroup]="machinesFormGroup" class="btn-group btn-group-circle margin-right-40" data-toggle="buttons"> 
       <label class="btn active bnt-group-override margin-left-0"> 
        <input type="radio" class="toggle" value="1" formControlName="buttonsMachine"> Machine 1 
       </label> 
       <label class="btn bnt-group-override margin-left-0"> 
        <input type="radio" class="toggle" value="2" formControlName="buttonsMachine"> Machine 2 
       </label> 
      </div> 
      <div [formGroup]="serversFormGroup" class="btn-group btn-group-circle" data-toggle="buttons"> 
       <label class="btn bnt-group-override active"> 
        <input type="radio" class="toggle" value="1" formControlName="buttonsServer"> Serv 1 
       </label> 
       <label class="btn bnt-group-override margin-left-0"> 
        <input type="radio" class="toggle" value="2" formControlName="buttonsServer"> Serv 2 
       </label> 
       <label class="btn bnt-group-override margin-left-0"> 
        <input type="radio" class="toggle" value="3" formControlName="buttonsServer"> Serv 3 
       </label> 
      </div> 
     </form> 
    </div> 

这里是plnkr链接。

Answer 1

你犯了一个错字错

变化

this.serversmachinesFormGroup= new FormGroup({ 
    machinesFormGroup: this.machinesFormGroup, 
    serversFormGroup: this.serversFormGroup, 
}); 

this.serversmachinesFormGroup.valueChanges.subscribe(value => { 
    console.log(value); 
}); 

到

this.serversMachinesFormGroup = new FormGroup({ 
    machinesFormGroup: this.machinesFormGroup, 
    serversFormGroup: this.serversFormGroup, 
}); 

this.serversMachinesFormGroup.valueChanges.subscribe(value => { 
    console.log(value); 
}); 

Plunker： https://plnkr.co/edit/ZhhOHPZb1JHjVeNsZU6M?p=preview