CODEWITHSUNDEEP
angularionic-frameworkionic3
Tamás Polgár
Tamás Polgár

Reputation: 2262

Ionic 3: ion-img not loading in ion-list

I have a pretty basic image list using [virtualScroll] and ion-img. An array named album is used as the source of the list.

<ion-list [virtualScroll]="album">
   <ion-item *virtualItem="let image">
      <ion-thumbnail item-start>
         <ion-img
         [src]="image.nativeURL"
         (click)="photoViewer.show(image.nativeURL, image.name, { share: false })">
         </ion-img>
      </ion-thumbnail>
      <p>
         <b>{{ image.name }}</b><br />
         {{ image.size | filesize }}<br />
         {{ image.modificationTime }}<br />
      </p>
      <ion-icon name="close" item-right (click)="deleteImage(i)"></ion-icon>
   </ion-item>
</ion-list>

The list scrolls smoothly, but the images don't always load, despite all of them are local images. Some do, some don't, apparently randomly. This is what it looks like:

https://snag.gy/6BpISl.jpg

Why?

Upvotes: 0

Views: 1115

Answers (1)

Tam&#225;s Polg&#225;r
Tam&#225;s Polg&#225;r

Reputation: 2262

All right, here's the solution. And it may sound ridiculous.

Just ditch ion-img and use img. It will scroll just as smoothly, and will not disappear.

However, I don't know how it'll work with hundreds of images.

Good thing Ionic has a half baked solution for everything, and none can be used!

Upvotes: 1

Related Questions