我已将地址信息返回到“ this.address”
ngOnInit() {
// this.getAddresses();
this.searchAddress.valueChanges.subscribe(
term => {
if (term != '') {
this.addressAutoCompleteService.search(term).subscribe(
data => {
this.addresses = Object.keys(data).map((key)=> {return data[key]}) ;
console.log('this.address', this.addresses)
});
}
})
}
在控制台上返回的this.address如下所示: enter image description here
能够遍历并自动填充输入字段,如下所示:
<form>
<mat-form-field class="container">
<input type="text" (input)="onInputChanged($event.target.value)" placeholder="Search addresses ..."
matInput
[formControl]="searchAddress"
[matAutocomplete]="auto"
>
<mat-autocomplete #auto="matAutocomplete">
<ng-container *ngFor='let filteredAddresses of addresses'>
<mat-option *ngFor="let address of filteredAddresses" [value]="address.Text">
<small>{{address.Text}}</small>
</mat-option>
</ng-container>
</mat-autocomplete>
</mat-form-field>
</form>
但是,当我从“选择地址”占位符中选择一个地址时,我无法加载其他字段,如下面指定的addressline1(其他信息从Web api返回)
<div class="tab-pane" id="address" role="tabpanel">
<div class="row">
<div class="form-group col-md-3 col-sm-3 col-xs-12">
<label l10nTranslate
>addressLine1</label
>
<input
class="form-control"
[formControl]="control.address.addressLine1"
/>
</div>
</div>
</div>
以及更改“搜索地址”后如何清除所有其他字段,例如addressline1。
谢谢。