Displaying list of fetched data

Hi :slight_smile:

I am struggling to display some data fetched from backend in a list (image + text),
so after successfully fetching the data in my .ts file:

var  damages = response;
damages.forEach(damage => {
                this.descValue = response.comment;
                this.imgValue = response.image;
                        })

I am not able to display it from the html file, Here’s how I am trying to deal with it but no way :confused:

<ion-content padding>
<ion-list>
  <ion-item *ngFor="let post of damage">
    <ion-thumbnail item-start>
      <img [src]="imgValue">
    </ion-thumbnail>
    <h2>{{descValue}}</h2>
  </ion-item>
</ion-list>
</ion-content>

Well, I’m not really sure why you’re looping through the list in your controller and then only storing the last description and image, but I think what you’d want is to do

this.damages = response

Then in your template

  <ion-item *ngFor="let post of damages">
    <ion-thumbnail item-start>
      <img [src]="post.imgValue">
    </ion-thumbnail>
    <h2>{{post.descValue}}</h2>
  </ion-item>
1 Like