I have a section with 3 fields, when click on new button, i must get the same section. I get no errors, so i am not getting where i am going wrong
Example here
HTML:
<form *ngFor="let emergency of Emergencies; let i = index">
<div>
<label > Name</label>
<input type="text" [(ngModel)]="emergency.Name" name="emergency.Name"
/>
</div>
<div>
<label >Phone</label>
<input type="text" OnlyNumber="true" [(ngModel)]="emergency.Phone" name="emergency.Phone"
maxlength="15" />
</div>
<div>
<label >Relations</label>
<select class="col-lg-6 col-md-6 col-sm-6 col-xs-6"[(ngModel)]="emergency.ship">
<option >{{ship.Description}}</option>
</select>
</div>
</div>
</form>
If you can use template driven
forms here is an answer for you.
Add a button for creating a new field
<button (click)="addEmergency()">New</button>
Now, add addEmergency
method in component:
addEmergency() {
var item = {
"ContactName":"Person3",
"Phone": "122355",
"relationship": ""
}
this.Emergencies.push(item);
}
In html:
<div *ngFor="let Emergency of Emergencies">
Your inputs go here
</div>
Here is a demo I created out from your code
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With