json圖像Angular框架

Question

我將數據從json導出到文本是show並且HTML一切都很好，但是當我需要從json導出圖像時我無法在HTML中顯示

如何將這個圖像JSON放入ionic框架

https://jsonplaceholder.typicode.com/photos

"thumbnailUrl": "http://placehold.it/150/771796"

我的其余api提供程序的代碼

getImg() {
  return new Promise(resolve => {
    this.http.get(this.apiUrl+'/photos').subscribe(data => {
      resolve(data);
    }, err => {
      console.log(err);
    });
  });
}

page.ts

  getImg() {
    this.restProvider.getImg()
    .then(data => {
      this.photos = data;
      console.log(this.photos);
    });
  }

page.html中

<ion-content>
  <ion-list inset>
    <ion-item *ngFor="let user of users">
      <h2>{{user.name}}</h2>
      <p>{{user.email}}</p>
      <img [src]="photo.thumbnailUrl">
    </ion-item>
  </ion-list>
</ion-content>

Answer 1

實際上，如果您的圖像存在於用戶數組中，則您編寫的代碼錯誤，請與用戶更改照片

<div *ngFor="let user of users">
      h2>{{user.name}}</h2>
      <p>{{user.email}}</p>
      <img [src]="user.thumbnailUrl">
</div>

並且如果您的圖像存在於photo array中 ，則代碼如下所示...

<div *ngFor="let user of users">
      h2>{{user.name}}</h2>
      <p>{{user.email}}</p>
</div>
<div *ngFor="let photosrc of photo">
      <img [src]="photosrc.thumbnailUrl">
</div>

謝謝