Setting html img properties

I am trying to create a “list” of images.

I originally tried:

<img [src]="p.url"/>

This did not work, so to check if p.url was there, I did:

<img [src]="p.url" [alt]="p.url" />

This still did not show anything.

To test that the alt tag did actually work, I changed it to alt="test"
This showed test.

To make sure p.url actually existed, I added:


This showed without any trouble.

I tried changing the image to:

<img src="{{p.url}}" alt="{{p.ul}}" />

This still does not show anything.

Am I doing something obviously wrong?

Thank you very much

so just to double check you have something similar to this

<div *ngFor="let p of pictures">
   <img [src]="p.url">

Hmm, could you check the dev tools, see if there are any errors showing up?

Pretty much, yes.

Interesting, I have since tested on my iPhone, and this code works there. It is in an Android emulator that this is not working.

If you want to see my exact code:

<ion-content padding>
  <ion-card *ngFor="let p of">
    <img [src]="p.url" [alt]="p.url" />
      <p>Photo: <i>{{p.url}}</i></p>

Hmm, check your CSP, check the dev to see if the image is actually loading