Getting error on displaying contact list


#1

hi , I am trying contact list and be able to select in order to send an invitation:

.ts:
import { Contacts } from ‘ionic-native’;

     @Component({
          selector: 'page-jobs',
          templateUrl: 'jobs.html'
       })

    export class JobsPage {  
        contactsfound = []
 
       constructor() {

          Contacts.find(["displayName"]).then((contacts) => {
              this.contactsfound = contacts;
              console.log(this.contactsfound)
          })
         }

.html:

 <ion-header>
   <ion-navbar>
     <ion-title>
       Contact
     </ion-title>
   </ion-navbar>
  </ion-header>

 <ion-content>
   <ion-list>
     <ion-list-header>Follow us on Twitter</ion-list-header>
        <ion-item *ngFor="let item of contactsfound">
         {{ item }}
        </ion-item>
    </ion-list>

Testing on browser I get:
I get an error Uncaught (in promise): TypeError: Cannot read property 'find' of undefined
can someone provide an example on how to do this… In Ionic 2 there is no good example

Testing on Android:

i get list of : [object Object]…


#2

Cordova plugins give you access to native mobile functionality, so they don’t work in a regular web browser. Android provides an API to access contacts, Chrome does not.


#3

yes I realized that… however it didn’t work until i did this and tested it on mobile

    <ion-item *ngFor="let item of contactsfound">
       {{ item.displayName }}
    </ion-item>

Now it displayed all the Names of the contacts…but it consisted of some white rows not sure why…also it didn’t display in order of Alphabets, can you provide some insight regarding this