有一个按钮,用户可以点击,这将添加更多的地址表单字段。如果用户在字段中填写他们的地址信息,然后单击按钮添加更多地址,则会清除之前的输入。如何防止该按钮清除以前的条目?
我的component.ts文件中的代码片段:
ngOnInit() {
this.addresses = [];
this.addresses.push(new Address('', undefined ,'','Canada',''));
}
addAddress(){
this.addresses.push(new Address('', undefined ,'','Canada',''));
}
我的address.ts文件:
export class Address {
constructor(
public streetAddress: string,
public province: string,
public city: string,
public country: string,
public postalCode: string
) { }
}
我的component.html文件中的代码片段:
<div class="card-body" *ngFor="let address of addresses">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<input type="text" class="form-control"
[(ngModel)]="address.streetAddress" #streetAddress="ngModel"
name="streetAddress" placeholder="Apartment/House Number and Street
Address">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input type="text" class="form-control" [(ngModel)]="address.city"
#city="ngModel" name="city" placeholder="City/Town">
</div>
</div>
</div>
</div>
<button type="button" class="btn btn-warning btn-block" id="addAddress"
(click)="addAddress()">More Addresses</button>
https://stackoverflow.com/questions/54027917
复制相似问题