Loading contact photos iOS in an image tag

Ionic Framework ionic-v3
1

I am using the Contacts plugin for ionic I load all the contacts name and email; however, I cannot load any photos

<div *ngFor="let cont of allContacts">
    <h3>Name: {{cont['name']['formatted']}}</h3>
    {{cont.photos[0].value}}
    <img src="{{cont.photos[0].value}}" height="150px" width="150px">
  </div>

This the path

/var/mobile/Containers/Data/Application/23C4E7F3-9509-45CB-9DD2-493CF891F6C3/tmp/contact_photo_354

I tried to add a .jpg at the end of the path but it does not work either

So how you load a contact photo in ionic wit the img tag?

Thanks

2

Can you output the whole photos[0] please?

On the Cordova plugin Github page is this remark:

photos: Returns a File URL to the image, which is stored in the application’s temporary directory. Contents of the temporary directory are removed when the application exits.

GitHub - apache/cordova-plugin-contacts: [DEPRECATED] Apache Cordova Plugin contacts
Does this help?

Did you remote debug the image tag on the device already? Follow these instructions here to debug the problem in Safari dev tools: Remote Debug your Ionic App · ionic.zone Then look at the console and network tab for loading errors. You can also dynamically change the src of the img tag to try different URIs…

3

Thanks for the reply I had to use DOMSanitizer