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