angular2 using input to dynamically add to form model
<p><em>This is to some extent a dupe of <a href="https://stackoverflow.com/questions/38896226/angular2-add-and-submit-a-new-formgroup-name-and-values-with-model-driven-form">this question</a> but hopefully less convoluted.</em> </p>

<p><strong>Is it possible to to add a completely new FormGroup via a form input where the new FormGroupName can be defined via input? If so which directives or functions would I use to achieve this?</strong></p>

<p>User Case:</p>

<p>The user can define a new FormGroupName via input field and click to extend the form with the new FormGroup, then fill out values for that FormGroup’s FormControls. </p>

<p>1 User fills out an existing 'name' field as normal. </p>

<p>2 Types ‘foo’ into an input field </p>

<p>3 Clicks ‘add data group’ to create the new FormGroup 'foo'</p>

<p>4 The form reveals input fields for 'height' and 'weight' for the new FormGroup foo.</p>

<p>5 User fills out 'height' and 'weight' values for 'foo'</p>

<p>6 Repeats step 2-5 for 'bar' </p>

<p>7 Submits:  </p>

<pre><code>{  
   "name":"Data Form",
   "foo":{  
      "height":"6.00",
      "weight":"300"
   },
   "bar":{  
      "height":"5.11",
      "weight":"260"
   }
}
</code></pre>

<p>The FormControls in the added FormGroups will always be consistent. 
So as in the above example always ‘weight’ and ‘height’.</p>

<p>The intention is to use the form as a basic UI to help generate some JSON data.</p>

<p>Thanks.</p>