[solved] Images not shown

Hello guys,

I’ve the problem that images don’t show up if the src-attribute does not include the whole image path (in Chrome).

Doesn’t work:
<img src="img/intro/countdown-clock.png">

Does work:
<img src="http://localhost:9000/img/intro/countdown-clock.png">

Having a look at the requests I see that in the first case the request for the image is pending while it is successful in the second case, see attached image. Though a hover in the network tab in chromes web developer tool shows the same url .

Ups, just realized that it’s not the same URL: localhost vs 0.0.0.0. This issue is due to my Grunt settings…

1 Like

I’m having this problem too. How did you solve it, did you convert every image into an external website link? I’d hoped to be able to serve a basic version of the app when the network was unavailable, but local urls don’t seem possible…

Yes how did you solve it? (this is not [solved])

Actually I didn’t try out to use local urls. I always use the IP of my computer in the local network as the URL (instead of localhost://) and then it works. Something like http://192.168.1.11:9000/index.html

I’ve got a similar problem. Although, in my app, the images appears in browsers, such as Firefox or Chorme, but not in my app when I execute “ionic run android”. I’m making a card slides like this:

             <ion-slide>
		<div class="list card">
		  <div class="item item-avatar">
		    <img src="../img/ionic.png">
		    <h2>Header</h2>
		    <p>description</p>
		  </div>
		  <div class="item item-image">
		    <img src="../img/bar.jpg">
		  </div>
		  <a class="item item-icon-left assertive" href="#">
		    <i class="icon ion-plus-round"></i>
		    See more!
		  </a>
		</div>
	</ion-slide>

Should I make the reference to the images in a different way?

yes me too i had this error, any solution ?

I used “img/bar.jpg” instead “…/img/bar.jpg”. It’s works form me.