angular 2 Reactiveformsラジオ・グループがロードされない

Question

2つのラジオ・ボタン・グループでフォームを作成しようとしていますが、画面に何も表示されず、コンソールにエラーも表示されません。

<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