Problem with ionic slide and images repeated


#1

Hello, I was wondering if I can receive some help due to a problem with ng-repeat in a Slideshow of images. I checked the other threads before submitting this one and did not find the solution. So basically i get this array of links from a service of mine and want to repeat them in a slideshow. Here the code

<div class="item item-image">
  <ion-slide-box does-continue="true" auto-play="true" on-slide-changed="slideHasChanged($index)">
    <ion-slide ng-repeat="photo in extraelement.image">
      <div ng-if="extraelement.website"><img src="{{photo}}" ng-click="goToLink('http://{{extraelement.website}}')"></div>
      <div ng-if="!extraelement.website"><img src="{{photo}}"></div>
    </ion-slide>
  </ion-slide-box>
</div>            

It works all fine but in the console logs i get this: GET http://localhost:8100/{{photo}} 404 (Not Found) ---- the error line is: %7B%7Bphoto%7D%7D:1
which looks strange. Since this bug kinda makes to crash my app, can anyone help me? Thank you


#2

Try using ng-src instead of src in the image element.


#3

but ng-src will also try to load empty variables i think. --> so you will produce failing requests as well

so i would add an ng-if to those images and the ng-src attribute


#4

Yeah, but it gave me the error also when the image was on the remote server. However, I put an if to check if the image is available, then used ng-src and the error is gone. Thank you @pmigabreu