无法将来自 Web api 的数据绑定到 Angular 中的选择选项

Question

我试图将一些数据绑定到 Angular 6 中的一个选择选项，我为此使用了 *NgFor：Json 数据结构如下：

{  
   "addresses":[  
      {  
         "address":"xxxxxxx",
         "address_line1":"None",
         "address_line2":"None",
         "address_line3":"",
         "billing":false,
         "id":79,
         "name":"xxxxx",
         "phone_number":null,
         "postal_code":"xxxxx",
         "town":"xxxxx"
      },
   ]
}

因此，要将其绑定到我正在执行的选择选项中：

<option value="null" disabled="true" [selected]="true">Select your option</option>
<option *ngFor="let item of address" [value]="item">
    {{item.address}}
</option>

获取数据的ts文件：

customerAddress = []; 

private getCustomerAddress() {
    this.service.getCustomerAddress(this.customer_id).subscribe((data) => {
      console.log('Result - ', data);
      console.log('Customer address data is received');
      this.customerAddress = data;
    })
  }

与此相关的服务：

  getCustomerAddress(customerId): Observable<any> {
    return this.http.get<any>(this.customerAddressApiUrl + "/" + customerId)
      .pipe(
        catchError(this.handleError)
      );
  }

选择选项中没有显示数据？ 但是console.log 中的数据很好。

Answer 1

这是正确的做法：

<option *ngFor="let item of customerAddress.addresses" [value]="item">
    {{item.address}}
</option>

Answer 2

您正在浏览的数组的名称是customerAddress而不是adresses