2017-05-04 7 views
0

私の反応するフォームに問題があります。私は追加されたテキスト入力と組み合わせる単一のラジオボタングループが必要です。ここに私のテンプレートで現在のコードに続いてcurrent preview of my input setAngular2はフォームグループの数をカスタマイズします

:主な問題は、すべての無線入力値があるが、新しい入力を追加することによって、ラジオ・ボタン・グループは新しいグループを作成することである

<div class="form-group row" formArrayName="externCallerIds"> 
       <div class="col-sm-5"> 
       <label for="extern-caller-ids" class="col-form-label">{{ 'USERS.extern' | translate }}<br> 
        <a class="btn btn-secondary add-button" id="extern-caller-ids" (click)="addExtCallerId()">Hinzufügen</a> 
       </label> 
       </div> 
       <div class="col-sm-7"> 
       <div *ngFor="let item of userForm.controls.externCallerIds.controls; let i = index" style="margin-bottom: 10px;"> 
        <div class="input-group"> 
        <span class="input-group-addon" [formGroup]="userForm"> 
         <input formControlName="externCallerId" type="radio" [value]="item.value"> 
        </span> 
        <div class="input-group"> 
         <input formControlName="{{ i }}" type="text" class="form-control col-12"> 
        </div> 
        <div class="input-group-btn" *ngIf="i > 0"> 
         <button type="button" class="btn btn-danger" (click)="delExtCallerId(i)"><i class="fa fa-minus"></i></button> 
        </div> 
        </div> 
       </div> 
       </div> 
      </div> 

入力名は同じです。単一のラジオボタングループを取得するにはどうすればよいですか?

私はこのプロジェクトの一部をPlunkrで実装しようとしました。それは動作しませんが、app.tsのコードは私のスクリプトと同じです。

+0

こんにちは、これのためにplunkrを作成できますか?実際にあなたがもっと具体的に何を望んでいるのかわかるようになります。 –

+0

こんにちは、私はここPlunkで私のプロジェクトのこの部分を実装しようとしました: http://plnkr.co/edit/GilKx80fW8ulBQUkGkKH?p=preview それは動作しません。しかし、app.tsのコードは私のスクリプトと同じです。 – Joeker

答えて

1

完全には明確ではありませんが、私はラジオボタンリストのための単一の選択を取得していないと仮定します。それで、ここに事があります。このようにしてください。

<input formControlName="externCallerId" name="radiogroup" type="radio" 
     [value]="item.value"> 

これは、あなたが探していたり​​いなかったものであれば、私に教えてください。

+0

こんにちはロナク、ありがとう。あなたは私のトラブルを解決しました。ソリューション内の単一の変更/問題は、入力の名前です。私はそれを "externCallerId"に変更しました - それ以降はラジオボタングループが私のために働いています:) PS:リアクションフォーム入力用の "formControlName"のために、その角度に名前属性が必要であるかどうかわかりませんでした。 – Joeker

+0

はい、グループ化には 'name'が必要です。 –

関連する問題