データ駆動型、デフォルトでループラジオボタンが有効ではない？

Question

私はいくつかのデータをループアウトする反応的なフォームを持っています。ここでラジオボタンのデフォルト値を設定したいと思います。その作品は、検証は動作しません。

<fieldset *ngIf="question.radioButtonList.length > 0"> 
     <div class="choice-list"> 
     <div *ngFor="let item of question.radioButtonList" class="choice-list-item"> 
      <input type="radio" [name]="choice" formControlName="choice" [id]="item.id" [value]="item.id" [checked]="question.answer.selectedChoiceId === item.id"/> 
      <label>{{item.title}}</label> 
     </div> 
     </div> 
    </fieldset> 

私のフォーム定義では、必要なバリデータをformControlNameに設定しました。

'choice': new FormControl('',Validators.required) 

ループ内でラジオボタンが正しくチェックされているが、バリデーターが無効であると言うことです。私がラジオボタンを手動でクリックするまで。

Answer 1

これは、有効と評価されるフォームコントロールに空の文字列として初期値を設定したためです。それはあなたのテンプレートの[checked]を無視します。だから、あなたは、フォームコントロールを作成するときに初期値を設定する必要があります。

'choice': new FormControl(someInitialValueHere, Validators.required) 

（これはラジオボタンで、チェックを外すことができないので、ところで、あなたは、ここにrequired検証を必要としない）

フォームを作成するときに初期値を設定することができない場合

、あなたはこれが何をしたいのようにデフォルト値を設定しますpatchValue

this.myForm.patchValue({choice: someValue}) 

を使用することができ、このしかしあなたがトンを持っていることを意味しますoデフォルト値（ロジック[checked]に対応）を設定するロジックを実行します。あなたが望むデフォルト値を見つけるためにおそらくループを繰り返す必要があるようです。