如何将http服务调用返回的值绑定到Angular6的UI中的字段下拉列表

时间:2019-02-06 10:47:09

标签: http angular6 angular-httpclient angular-material-6

调用邮政服务后,我得到如下响应:我要从此处获取的bankName数据用作UI中下拉字段的选择值 如何将这些值绑定到对象,以便可以在UI上进行相同的插值。 预先感谢。

"data":[{"bankCode":"1","bankName":"A AND N STATE CO OPERATIVE BANK LTD"},{"bankCode":"2","bankName":"A B E CO OPERATIVE BANK LTD"},{"bankCode":"3","bankName":"A C C BANK"}...

我已经尝试过这种方法,但是遇到以下错误

  

错误错误:找不到类型为“对象”的其他支持对象“ [对象对象]”。 NgFor仅支持绑定到数组等Iterable。

这是我的服务代码-:

getIncCompany(): Observable<PolicyData> {
  const headers = new HttpHeaders({ 'Content-Type': 'application/json'});
  let body = '{}';
  return this.http
  .post<PolicyData>(this.apiUrl, body, { headers: headers })
    .pipe(
      tap(data => console.log('getIncCompany: ' + JSON.stringify(data))),
      catchError(this.handleError)
    );
}

这是组件代码

getIncCompany() {
    this.policyService.getIncCompany()
    .subscribe(data => { 
     this.policyinc = data,
    (error: any) => this.errorMessage = <any>error,
    console.log(this.policyinc);
    }
            // this.vehicleDetailsForm.reset(),
);
    }

这是html模板代码

<div class="col-lg-4 m-form__group-sub">
                                            <mat-form-field class="example-full-width" appearance="outline">
                                                <mat-label> Handicapped Discount
                                                </mat-label>
                                                <mat-select placeholder="Select">
                                                    <mat-option value="option" *ngFor="let polB of policyinc">{{ polB.bankName }}</mat-option>
                                                </mat-select>
                                            </mat-form-field>
                                        </div>

0 个答案:

没有答案