How to add form elements on button click in Angular 7

Question

I want to repeat below form elements

<tr>  
                   <td class="tbl1">  
                   <mat-form-field class="demo-full-width">  
                   <input name="Label" matTooltip="Label" matInput placeholder="Label" ngModel>
                   </mat-form-field> 
                   <mat-form-field>
                   <mat-label>Input Type</mat-label>
                   <select name="inputBoxType" matNativeControl ngModel required>
                   <option value="text">Text</option>
                   <option value="number">Number</option>
                   <option value="email">Email</option>
                   </select>
                   </mat-form-field>
                   <button type="button" mat-raised-button color="accent" class="btn btn-danger" matTooltip="Add Input Box" >Add Another Input Box</button>
                   </td>  
          </tr>

On click "Add Another Input Box" I want to repeat above form elements. Please help.

Thomas Cayne · Accepted Answer · 2019-11-05 06:50:42Z

1

Take a look into Angular's FormArray https://angular.io/api/forms/FormArray & When to use FormGroup vs. FormArray? & https://stackblitz.com/edit/angular-form-array-example (for a great working example)

answered Nov 5, 2019 at 6:50

Thomas Cayne

1,62012 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to add form elements on button click in Angular 7

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related