7

私はAngular 2 のドキュメントを探していますが、 formGroupの使用方法に関するベスト プラクティスを見つける方法がありません。

formGroupを form タグで囲むことは必須ですか?

私はこのスタックオーバーフローの質問を見てきました:

formGroup には FormGroup インスタンスが必要です

このコンポーネント テンプレートを作成しました。

<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>

ネストされたフォームタグの使用を避けようとしています

4

1 に答える 1

9

あなたが探しているのはformGroupNameディレクティブです

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

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

ネストされたフォーム グループは、フォームのサブグループを残りとは別に検証する場合や、特定のコントロールの値を独自のネストされたオブジェクトにグループ化する場合に便利です。

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

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

ドキュメントによると、これは法的に定義され、複数のタグが使用され<form [formGroup]="formProperty">ないようにするために、ある時点で に含める必要があります。<form>

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

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

@Input() parentGroup: FormGroup;
于 2016-11-15T16:49:27.270 に答える