Unable to show images in iOS

1

Trying to use a model to display images in my app. NO images are displaying .

      <ion-scroll direction="xy" scrollbar-x="false" scrollbar-y="false"
      zooming="true" min-zoom="{{zoomMin}}" style="width: 100%; height: 100%"
      delegate-handle="scrollHandle{{$index}}" on-scroll="updateSlideStatus(activeSlide)" on-release="updateSlideStatus(activeSlide)">
 
      <div class="image" style="background-image: url( {{image.nativeURL}} )"></div>
      
      <p style="background-color: black; color: white; bottom: 0; width:100%; text-align: center; position: fixed;">
                        {{image.nativeURL.split('/').pop()}}
                    </p>
    </ion-scroll>
  </ion-slide>
</ion-slide-box>
</div>

image.nativeURL is file:///var/mobile/Containers/Data/Application/A1F5B2C1-EB82-4C5D-8769-34455B8BE096/Documents/files/images/green_nature_dual_monitor-other.jpg

Ionic info

Cordova CLI: 5.3.1
Ionic CLI Version: 1.6.4
Ionic App Lib Version: 0.3.8
ios-deploy version: 1.7.0
ios-sim version: 4.1.1
OS: Mac OS X Yosemite
Node Version: v0.12.7
Xcode version: Xcode 6.4 Build version 6E35b

2

Is the binding a typo? You have

{{iimage.nativeURL}} with two lower-case 'i'
3

sorry its a typo when pasting code here.

got this from http://devdactic.com/ionic-image-zooming/

4

Okay. Put this in your .html and paste the result here so I can see it.

 <pre>{{image}}</pre>

If you have something then you know you have image binded to the $scope, if you have nothing in the pre tag then you are not. Also, it would be good to see your controller here also, remove any private info and replace with dummy text if you must.

5

Hi bradmartin,

I removed application on iPad and reinstalled it. so application id is different from the above url.

in pre tag i am getting

{“isFile”:true,“isDirectory”:false,“name”:“green_nature_dual_monitor-other.jpg”,“fullPath”:"/files/images/green_nature_dual_monitor-other.jpg",“filesystem”:"<FileSystem: persistent>",“nativeURL”:“file:///var/mobile/Containers/Data/Application/CD291A20-47D4-464D-A934-31C239D6F2F5/Documents/files/images/green_nature_dual_monitor-other.jpg”,“img”:“img/jpg.jpg”,"$$hashKey":“00Z”}

every thing is working fine, except no image is showing in img tag.

6

Try using a standard image tag.

  <img ng-src="{{image.nativeURL}} />

See if the image shows then.