Ionic native contacts are not working?

And what does the inspector tell you then?

Uncaught Error: Can’t resolve all parameters for ContactField: (?, ?, ?).
at syntaxError (compiler.es5.js:1540)
at CompileMetadataResolver._getDependenciesMetadata (compiler.es5.js:14877)
at CompileMetadataResolver._getTypeMetadata (compiler.es5.js:14745)
at CompileMetadataResolver._getInjectableMetadata (compiler.es5.js:14731)
at CompileMetadataResolver.getProviderMetadata (compiler.es5.js:15021)
at compiler.es5.js:14950
at Array.forEach ()
at CompileMetadataResolver._getProvidersMetadata (compiler.es5.js:14911)
at CompileMetadataResolver.getNgModuleMetadata (compiler.es5.js:14566)
at JitCompiler._loadModules (compiler.es5.js:25630)

My project that is working for me?

If so, please describe all the steps you took in the command line.

The problem lies outside of what has been posted. That error is coming from DI, which means somebody somewhere is attempting to inject a ContactField (which is not intended to be injected).

ionic cordova plugin add cordova-plugin-contacts

npm install --save @ionic-native/contacts

I followed official document steps as step by step

@rapropos how to do? could you explain what is the solution ?

Look for where you are trying to inject a ContactField, such as someplace where you put an access qualifier on a constructor parameter of that type. Get rid of that. It makes no sense.

Problem Solved !!

What I did is :

Just add
import { Contacts } from ‘@ionic-native/contacts’; in imports & Contacts in your provider in your app.module.ts file.

& Add import { Contacts, Contact, ContactField, ContactName } from ‘@ionic-native/contacts’; in file from where you want you create & save contact.

then same as said in standard document of ionic

let contact: Contact = this.contacts.create(); = new ContactName(’’, ‘Smith’, ‘John’);
contact.phoneNumbers = [new ContactField(‘mobile’, ‘6471234567’)];
() => console.log(‘Contact saved!’, contact),
(error: any) => console.error(‘Error saving contact.’, error)

Hope this helps.
Ask me if any query.

1 Like


I am facing an issue while displaying device contacts for ios in ionic 3. I am using this.contacts.find((contacts) => {}) and this.contacts.pickContact((contacts) => {}). But when I call one of method from them it directly close my app? Please let me know your thought on it. Need your help

Looks like a permission problem… Is it requesting permission to access the contacts?


Thank you very much for your feedback. Sorry but I didn’t find out what is the exact issue, App directly close when I use this.contacts.find() or this.contacts.pickContacts() method, even I can’t debug it

Try to use Diagnostic Plugin to get the Contact Permission.
Do something like this:

  .then((state) => {
    if (state){
      // Call your Contacts Code
    } else {
      // do something else
}).catch(e => console.error(e));
1 Like

Thanks, let me check with it and let you know. Thanks again :slight_smile:

seems to be working ! Thanks mate!

This post was flagged by the community and is temporarily hidden.

try this version

npm install @ionic-native/contacts@4.20.0

hy iscorobogaci please share src code …?

my project will stuck on this contact module plese help…

import {Injectable} from '@angular/core';
import {Diagnostic} from '@ionic-native/diagnostic/ngx';
import {WebView} from '@ionic-native/ionic-webview/ngx';

import {Contact, PhoneNumber} from './contact.model';

declare let navigator: any;

    providedIn: 'root'
export class DeviceContactsService {

    constructor(private diagnostic: Diagnostic, private webView: WebView) {

    retrieveContacts(): Promise<Array<Contact>> {
        return new Promise<Array<Contact>>((resolve) => {
                .then((status) => {
                    if (status !== this.diagnostic.permissionStatus.GRANTED) {
                            .then(() => {
                                    .then(contacts => {
                    } else {
                        let deviceContacts: Contact[] = [];

                            .list(contacts => {
                                contacts.forEach(deviceContact => {
                                    const contactModel: Contact = this.buildFrom(deviceContact);
                                    if (contactModel.phoneNumbers.length > 1) {
                                        contactModel.phoneNumbers.forEach(phoneNumber => {
                                            const contact: Contact = new Contact();
                                            contact.firstName = contactModel.firstName;
                                            contact.lastName = contactModel.lastName;
                                            contact.displayName = contactModel.displayName;
                                            contact.phoneNumbers = Array(1).fill(phoneNumber);

                                deviceContacts = deviceContacts.filter(contact => {
                                    let isValid = true;
                                    contact.phoneNumbers.forEach(phoneNumber => {
                                        isValid = !(phoneNumber.normalizedNumber.startsWith('*') || phoneNumber.normalizedNumber.startsWith('#'));
                                    return isValid;

                                deviceContacts.sort((c1, c2) => c1.displayName.toLowerCase().localeCompare(c2.displayName.toLowerCase()));
                            }, err => {
                                console.log('Error while getting device contacts', err);

    private buildFrom(nativeContact): Contact {
        const contact: Contact = new Contact();
        contact.firstName = nativeContact.firstName;
        contact.lastName = nativeContact.lastName;
        contact.displayName = nativeContact.displayName;
        contact.phoneNumbers = [];
        nativeContact.phoneNumbers.forEach(phoneNumber => {
            const number: PhoneNumber = new PhoneNumber();
            number.normalizedNumber = phoneNumber.normalizedNumber;
        }); = this.resolveProfilePicture(nativeContact);

        return contact;

    private resolveProfilePicture(nativeContact): string {
        if (nativeContact.thumbnail) {
            return this.webView.convertFileSrc(nativeContact.thumbnail);

        return './assets/images/default-contact.svg';

Try this one mate, I made it work like this, using a promise… let me know how it went .used :

"@ionic-native/contacts": "^5.2.0",
"cordova-plugin-contacts-phonenumbers": "0.0.12",

make sure you add in config.xml :

<uses-permission android:name="android.permission.READ_CONTACTS" />

Good luck