Ionic 5 Phone Calls with Cordova and Ionic Native 5

Ionic 5 Phone Calls with Cordova and Ionic Native 5

The primary task of a phone device is to make calls so being able to make calls in Ionic 5 is a nice feature that can be leveraged to create awesome apps.

In this tutorial, we will be seeing how to use Cordova and Ionic Native 5 to make phone calls from within Ionic 5 mobile apps.

Create an Ionic 5/Angular Project

As always, you can start by scaffolding a new Ionic 5 application using the Ionic CLI 5.

Head over to your terminal/prompt and run the following command:

ionic start IonicPhoneCallExample blank 
cd IonicPhoneCallExample 

Installing the Cordova and Ionic Native 5 Phone Call Plugins

Now, we need to install Cordova plugin for making phone call and its Ionic Native 5 wrapper as follows:

ionic plugin add --save call-number
npm install --save @ionic-native/call-number

Using the Phone Call Plugin in Ionic 5

Next, head over to the src/app/app.module.ts file and add the following code:

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { CallNumber } from '@ionic-native/call-number';

declarations: [
imports: [
bootstrap: [IonicApp],
entryComponents: [
providers: [
    {provide: ErrorHandler, useClass: IonicErrorHandler}
export class AppModule {}

Next, open the src/pages/home/home.ts file and add a method to make a phone call as follows:

import { Component } from '@angular/core';
import { CallNumber } from '@ionic-native/call-number';

selector: 'home',
templateUrl: 'home.html',
export class HomePage {

constructor(private callNumber: CallNumber) {

        this.callNumber.callNumber(n, true)
        .then(() => console.log('Launched dialer!'))
        .catch(() => console.log('Error launching dialer'));


Finally, open the src/pages/home/home.html file and add a button to launch the dialer:

<button ion-button (click)="launchDialer('00 00 00 00')">Call 00 00 00 00</button>


You can now add a target platform and test your Ionic 5 app in a real mobile device by making a phone call.