Erik Heissig
Erik Heissig

Reputation: 13

Angular2 [src] causing 404 error when loading image dynamically

i´ll try to load an image after the page is loaded into a modal form that opens on click.

My image Tag looks like this:

<img src="/src/files/bstand{{detailEntry.bearbeitungsstand}}.png">

The image source is correct. But when i load the page my variable detailentry is empty because i am fill it on click of a button. so the console shows me a 404 error with url: "/src/files/bstand.png" which does not exist Wehen ic Click the button the image is loaded properly.

I remember that i used ng_src in angular 1 and the equivalent shout be [src] i thought but it does not work.

Thank you for any answer!

Upvotes: 1

Views: 942

Answers (2)

Sebastian Krysiak
Sebastian Krysiak

Reputation: 911

You can wait for the detailEntry with ngIf

<img *ngIf="detailEntry.bearbeitungsstand" src="/src/files/bstand{{detailEntry.bearbeitungsstand}}.png">

Upvotes: 1

Tim B
Tim B

Reputation: 2368

You could use *ngIf to keep the image tag from being rendered without a valid src.

<img *ngIf="detailEntry.bearbeitungsstand" src="/src/files/bstand{{detailEntry.bearbeitungsstand}}.png">

Upvotes: 1

Related Questions