Hi, I am build an ionic app which is both online and offline. Api has many server url images and I need to load those while in offline mode. For that I downloaded the images and set the downloaded file path in ‘onError’ event of image. But it is not working with dynamic images. Do anyone have a b…

Have you tried something like: <img src="{{imagepath || 'assets/imgs/error.png'}}"> where imagepath the dynamic location of the image you want to load and ‘assets/imgs/error.png’ is the fallback. It may be helpful if you provide some code that you’re expecting to work.

Hi @ZeroTerminated , Thanks for the reply. I needs to load dynamic image for the fallback. My code is as follows: <ion-slide *ngFor="let img of edition"> <img [src]= img.imgsrc loop="true" onError="src = img.imgsrc_offline"> </ion-slide> Thanks.

Hi @ZeroTerminated , I tried but getting ‘unsafe:’ for my image path. Do I need to do anything further to avoid this. Thanks.

A good solution is to write a directive for that. It grabs the image element and puts a placeholder image to its src property. Then it checks on the device for the image file. If it exists, it changes the src property to that file path. If it does not exist, it tries to download the file and after s…

I think this depends on where your image path is - where are the files, are you referencing them correctly? You can try look up DomSanitizer import { DomSanitizer } from '@angular/platform-browser'; Sample code/errors will help. Do you know what values are causing the error.

Ionic image tag to have dynamic images 'onError' event

Ionic Framework ionic-v3

akhiilsanker February 14, 2018, 11:34am 7

Hi,
I found a solution from *ngIf fallback / default img src in Ionic.

Thanks.

Topic		Replies	Views
*ngIf fallback / default img src in Ionic ionic-v3	4	8585	June 21, 2017
How to handle images that might or might not load? ionic-v3	7	3673	July 27, 2017
Dynamic images not getting load in ionic with angular for android mobile app ionic-v1	11	12954	July 6, 2015
Ionic RC.4 setting fallback image in [style.backgroundImage] ionic-v3	1	1490	January 13, 2017
How to set the default image on a img src while whole response is not received in ionic3? ionic-v3	21	28189	October 28, 2020

Ionic image tag to have dynamic images 'onError' event

Related topics