Abhi
Abhi

Reputation: 684

How to add form elements on button click in Angular 7

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.

Upvotes: 0

Views: 4758

Answers (1)

Thomas Cayne
Thomas Cayne

Reputation: 1485

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)

Upvotes: 1

Related Questions