Angular 2 creating reactive forms with nested components

After my research & experiments I found one answer to my question, so answering it myself. If it saves someone’s time then I will be happy.

If you want to create reactive forms with nested components then you can do as below

Here I am creating a form with two nested components one for textbox & other for radio button

Your parent component can be like this

<form [formGroup]="myForm">
    <child-textbox-component [parentFormGroup]="myForm">
    </child-textbox-component>
    <child-radio-button-component [parentFormGroup]="myForm">
    </child-radio-button-component>
</form>

We are passing FormGroup object as input to child components which has been created in the parent component
as input to the child components, they will use this FormGroup object in their
component to design specific control of the class

Your child components will be like this

child-textbox-component

<div class="form-group" [formGroup]="parentFormGroup">
  <label>
    {{control.caption}}
  </label>
  <input class="form-control" type="text" Angular 2 creating reactive forms with nested components="control.toolTip" 
    [attr.maxlength]="control.width" [name]="control.name"
    [value]="control.defaultValue" [formControlName]="control.name"/>
</div>

child-radio-button-component

<div class="form-group" [formGroup]="parentFormGroup">
  <label>
    {{control.caption}}
  </label>
  <div>
      <label *ngFor="let value of control.values; let idx = index"
        class="radio-inline" Angular 2 creating reactive forms with nested components="control.tooltip">
        <input type="radio" [name]="control.name" [formControlName]="control.name"/>
        {{ value }}
      </label>
  </div>
</div>

Here control is the model class holding data to be displayed for these
child components.

This way you can have your form to be generated using nested components,
so that you need not have your form (can say large form) in single
component. You can break it down to as many sub components & form will
be easy to create & maintain also using reactive forms of angular 2. You can also easily add validations too.

I followed these links before answering this

1. something similar on stackoverflow

2. angular 2 dynamic forms