2016-11-15 4 views
1

私はAngular 2 documentationを探しています。使用方法に関するベストプラクティスを見つける方法はありませんformGroupフォームタグなしでAngular 2のformGroupを使用することはできますか?

formGroupをフォームタグで囲む必要がありますか?私は、このコンポーネントを作成しました

formGroup expects a FormGroup instance

<div [formGroup]="infoIdentityForm"> 
    <div class="info-identity_title" *ngIf="showTitle"> 
    <div class="group-title">Titre</div> 
    <div class="group-radio"> 
     <span *ngFor="let choice of enumTitleValue"> 
      <label>{{choice}}</label> 
      <input type="radio" formControlName="title" 
      name="title" [id]="choice"/> 
     </span> 
    </div> 
    </div> 
    <div class="info-identity_firstname"> 
    <div class="group-title">Prénom</div> 
    <div class="group-input"> 
     <input type="text" class="form-control" formControlName="firstName" maxlength="25"> 
    </div> 
    </div> 
    <div class="info-identity_lastname"> 
    <div class="group-title">Nom</div> 
    <div class="group-input"> 
     <input type="text" class="form-control" formControlName="lastName" maxlength="25"> 
    </div> 
    </div> 
</div> 

私はavoid the use of nested form tagsにしようとしている私は、このスタックオーバーフローの質問に見てきた

あなたが探しているもの

答えて

6

は、このディレクティブは、親FormGroupDirective (:[formGroup]セレクター)で使用することができますformGroupNameディレクティブ

です。

リンクするネストされたFormGroupの文字列名を受け入れます( )。 FormGroupDirectiveに渡したFormGroupインスタンスの親にその名前で登録されたFormGroupが検索されます。

フォームの サブグループを残りの部分とは別に検証する場合や、 に特定のコントロールの値を独自のネストされたオブジェクトにグループ化する場合は、ネストされたフォームグループを使用すると便利です。ドキュメントごとに、法的に定義されるべきいくつかの点で<form [formGroup]="formProperty">であることと、使用されている複数の<form>タグを避けるために必要があり、

https://angular.io/docs/ts/latest/api/forms/index/FormGroupName-directive.html

<div formGroupName="infoIdentityForm"> 
</div> 

子コンポーネントをお持ちの場合は、まだ[formGroup]が必要ですが、<form>タグには含めることはできません。すべてを1つの大きなフォームで使用したい場合は、親からFormGroupを入力して、次のように設定する必要があります。

<td [formGroup]="parentGroup"> 
    <input type="text" formControlName="myControl" 
</td> 


@Input() parentGroup: FormGroup; 
+0

クールなトリック、素晴らしい仕事です! – Abdel

関連する問題