title: In angular, how to dynamically add different FormGroup into a FormArray?
body: <p>I want to dynamically add several dishes into this order array. Each dish is a FormGroup.  Dish could be pizza, salad, drink or something else. Before adding anything, the form should look this:</p>
  <pre><code>this.fb.group({
    firstName: ['', Validators.required],
    lastName: [''],
    order: this.fb.array([])
  });
  </code></pre>
  <p>After added dishes, form should be something like this:</p>
  <pre><code>this.fb.group({
   firstName: ['', Validators.required],
   lastName: [''],
   order: this.fb.array([
     {type:pizza, name:summerPizza, size:8},
     {type:salad, name:goodsalad, size:small},
     {type:pizza, name:nicePizza, size:11},
     {type:drink, name:beer, brand:abc},
   ])
  });
  </code></pre>
  <p>User can add as many items as they want. So how to do this?</p>