how to add row in angular dynamically
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>Code</th>
<th>Name</th>
<th>Price</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let field of fieldArray; let i = index">
<td>
<input [(ngModel)]="field.code" class="form-control" type="text" name="{{field.code}}" />
</td>
<td>
<input [(ngModel)]="field.name" class="form-control" type="text" name="{{field.name}}" />
</td>
<td>
<input [(ngModel)]="field.price" class="form-control" type="text" name="{{field.price}}" />
</td>
<td>
<button class="btn btn-default" type="button" (click)="deleteFieldValue(i)">Delete</button>
</td>
</tr>
<tr>
<td>
<input class="form-control" type="text" id="newAttributeCode" [(ngModel)]="newAttribute.code" name="newAttributeCode" />
</td>
<td>
<input class="form-control" type="text" id="newAttributeName" [(ngModel)]="newAttribute.name" name="newAttributeName" />
</td>
<td>
<input class="form-control" type="text" id="newAttributePrice" [(ngModel)]="newAttribute.price" name="newAttributePrice" />
</td>
<td>
<button class="btn btn-default" type="button" (click)="addFieldValue()">Add</button>
</td>
</tr>
</tbody>
</table>