How to display contacts photos

@Murhaf wrote:

Hi,

I'm trying to embed contacts in my app, I am using cordova-plugin-contacts with @ionic-native/contacts

  <ion-list>

    <button ion-item *ngFor="let contact of list | filterBy: {displayName: term}">

      <ion-avatar item-start>
        <img *ngIf="contact?.photos" [src]="contact.photos[0].value | safeUrl" />
      </ion-avatar>

      <div>
        <p> {{ contact.displayName || contact.phoneNumbers[0].value }} </p>
      </div>

    </button>

  </ion-list>


constructor(public contacts: Contacts,) {
    contacts.find(['displayName', 'phoneNumbers', 'photos'], {multiple: true}).then((res) => {
      console.log(res[0].photos[0]);
      this.list = res;
    }).catch(err => {
      console.log('Error');
    });

the code displays the contacts display names and phone number, but I get error on contact img, because contact.photos[0].value path look like this content://com.android.contacts/contacts/1/photo

Is there something I should use to get contact images displayed?

Thank you.

Posts: 1

Participants: 1

Read full topic