title: Angular model driven form nested components parent form dependecy
body: <p>I have been working on the implementation of model driven form for an application with many nested components.</p>
  
  <p>It is an snippet of my current template</p>
  
  <pre><code>&lt;div [formGroup]="formGroup"&gt;
    &lt;mycomponent1 [formParam]="getForm('myForm1')"&gt;&lt;/mycomponent1&gt;
    &lt;mycomponent2 [formParam]="getForm('myForm2')"&gt;&lt;/mycomponent1&gt;
    &lt;mycomponent3 [formParam]="getForm('myForm3')"&gt;&lt;/mycomponent1&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>.ts file snippet</p>
  
  <pre><code>ngOnInit() {
   this.formGroup= this.fb.group({
     myForm1 = this.fb.group({...}),
     myForm2 = this.fb.group({...}),
     myForm3 = this.fb.group({...})
   });
  }
  
  getForm(formName: string) {
    return &lt;FormGroup&gt;this.formGroup.get(formName);
  }
  </code></pre>
  
  <p>My question is: does anyone know some other approach in order to implement a model driven form to nested components without the dependency to define an <code>@Input</code> form group parameter to the children components?</p>
  
  <p>I mean, how to avoid to do this for every nested component?</p>
  
  <pre><code>@Input() formParam: FormGroup;
  </code></pre>
  
  <p>Why I'm asking that, because I have more nested components and I'm forced to define a formgroup as <code>@Input</code> in the rest of nested components which is very heavy work.</p>
  
  <p>Cheers.</p>