显示来自httpClient迭代ngFor的Angular4响应数据

自从你使用 {observe: 'reaponse'} 对于 HttpClient.get ,将有完整的响应(标题和正文)返回,您可以使用 *ngFor data.body 通过将其作为 公共变量 详情如下:

data: any;

this.http.get(..., {observe: 'response'})
    .subscribe(data => this.data = data.body);

<div *ngFor="let item of data">
  {{item.address}}
</div>

HttpClient。收到 {observe: 'response'} . 你也可以不用 {观察:'响应'} 详情如下:

data: any;

this.http.get(...)   // without observe: response
    .subscribe(data => this.data = data);

<div*ngFor=“let item of data”>
{{item.address}}

也可以使用 async template 不使用公共变量公开数据:

data$: any;

this.data$ = this.http.get(...)
// or 
this.data$ = this.http.get(..., {observe: 'reaponse'}).map(data => data.body);

<div *ngFor="let item of data$ | async">
  {{item.address}}
</div>