Fetching contacts in ionic 2

Fetching contacts in ionic 2

This tutorial is about displaying all contact list from mobile contact book using ionic 2.

In this tutorial we are using latest version of ionic that is ionic 2. New version of ionic was released with many new features with resolved many bug.

Before We start make sure your ionic is updated with ionic 2. If not then update ionic with following command.

Let’s start with creating fresh new ionic 2 blank project

Got to project folder

Adding platform

Note that if you have to make ios app then you required mac

After that install Contacts plugin

go to fetchcontact/src/pages/home/home.ts

In above code first import Contacts from ionic-native & Platform from ionic-angular

Here find() method is used for fetching contacts from mobile phone. find() method has two parameter that is fields & options

For more information please read contacts plugin official documentation.

Storing all contacts of mobile device to contactlist array after applying find() method

Let’s move to html stuff

go to fetchcontact/src/pages/home/home.html

Here displaying displayName and phoneNumbers from contact one by one from contact list array using *ngFor.

Now time for checking app in real device


Leave a Reply