ネストされたフォームを角2で検証する

Question

私は3つのコンポーネントを持つフォームを持っています。以下はフォームのhtmlです：

<div class="p-r-0 m-t-1 p-r-half p-l-half"> 
    <div class="tab-content">   
     <div *ngIf="vitalsData != null"> 
      <emp-info *ngIf="far == '1'" [(dataContext)]="empData"></emp-info> 
      <emp-work *ngIf="sections == '2'" [(dataContext)]="empData"></faa-ch145> 
     </div> 
    </div> 
    <div class="right pull-top pos-relative"> 
      <button class="btn btn-primary" type="button">Reset</button> 
      <button class="btn btn-primary" type="button">Save</button> 
    </div> 
</div> 

emp-infoとemp-workの2つのコンポーネントがあります。 emp-infoおよびemp-workページには、いくつかの必須フィールドがあります。今私が必要なフィールドを保存するときに検証する必要があります。しかし、子コンポーネントには必須フィールドがあり、親コンポーネントには保存ボタンがあります。誰も私に子コンポーネントのフィールドのエラーを検証して表示する方法を教えてもらえますか？

Answer 1

角度Formsは、コンポーネント内部を検証しません。検証する場合はemp-info | emp-workコンポーネントの場合は、ControlValueAccessorを実装する必要があります。したがって、Angularはカスタムコンポーネント（完全に機能するFormControlになります）で操作できます。

カスタムコンポーネントがコンテナのみの場合に適している別のオプションは、FormGroupインスタンスを渡して内部フォームコントロールを接続することです。 DynamicFormQuestionComponentがFormGroupインスタンスをどのように受け取るか

https://angular.io/docs/ts/latest/cookbook/dynamic-form.html#!#question-form-components

注意：このトピックの角度のマニュアルを参照してください。

Answer 2

emp-workとemp-infoは、FormControlで作成されます。次に、両方の内部にFormGroupを入れます。あなたのオブジェクトファクトリの内部では、Validators.requiredを使用するか、その属性のいずれかを使用できます。