Question

在Ionic 4中，我试图显示get响应的结果。我得到了路线的结果，但是如何在html页面中显示呢？

在我的license.page.ts中：

  ngOnInit() {
    return this.httpClient.get(`${this.AUTH_SERVER_ADDRESS}/license`).subscribe(data=>{
      //process the json data
      console.log(data);
      })
  }

在我的答复中：

Object { site_id: "ABC", side_key: "GWA9TjApcyAKEhnx", license_limit: 1 }

我生成了一个license.ts，但是现在不确定我是否需要这样做。

export interface License {
    site_id: string;
    site_key: string;
    license_limit: number;
}

如何在我的license.page.html中显示此信息？

          <ion-list>
            <ion-item>
              <ion-label>Site ID</ion-label>
            </ion-item>
            <ion-item>
              <ion-label>Site Key</ion-label>
            </ion-item>
            <ion-item>
              <ion-label>License Limit</ion-label>
            </ion-item>
          </ion-list>

Answer 1

由于您使用的是离子列表，因此可以在数组上工作，因此在分配之前将对象转换为数组，

声明一个变量

sites : any = [];

然后

return this.httpClient.get(`${this.AUTH_SERVER_ADDRESS}/license`).subscribe(data=>{
   this.sites = [data];
})

，您的HTML应该看起来像

<ion-content>
  <ion-list>
        <ion-item *ngFor="let site of sites;">Site ID {{site.site_id}}</ion-item>
    </ion-list>
</ion-content>

Ionic 4-如何显示对HTML页面的请求结果

1 个答案: