Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Ionic3| Facing with an issue when add InAppBrowser into providers

I need open a link into my Ionic-3 project and when I google it I saw InAppBrowser Plugin.

Actually there is only one picture in this link so If you know any other method for get it or show directly this picture it is can be enough for me.

I done all of it like what documentary done. The Documentary which is I used for : https://blog.paulhalliday.io/ionic-3-integrating-inappbrowser-plugin/

Step-1: I installed ionic cordova plugin add cordova-plugin-inappbrowser

Step-2: I installed as well npm install @ionic-native/in-app-browser --save

And there was no error in Command Line(Terminal)

Step-3: I imported the plugin into app.module.ts import { InAppBrowser } from '@ionic-native/in-app-browser'; And there was no error in code editor

!!! Step-4: When I tried to add InAppBrowser into providers part I faced an error like picture which below This is the picture of error If you can not see : http://prntscr.com/mc964l link is here.

Why that error happened I do not get it.

Can anybody help me about this issue?

Thanks in advance!

like image 216
Alihan Kayhan Avatar asked Jan 25 '19 21:01

Alihan Kayhan


1 Answers

Ionic 3:

Install the Cordova and Ionic Native plugins:

$ ionic cordova plugin add cordova-plugin-inappbrowser
$ npm install --save @ionic-native/in-app-browser@4

You must append version 4 to the package name after the @ character (version 5.x is not compatible with Ionic 3):

Then, add to Provider:

import { InAppBrowser } from '@ionic-native/in-app-browser';

...

@NgModule({
  ...

  providers: [
    ...
    InAppBrowser 
    ...
  ]
  ...
})
export class AppModule { }

Source: https://ionicframework.com/docs/v3/native/in-app-browser/

Ionic 4:

For Angular, the import path should end with /ngx

import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';

Then, add to Provider:

// app.module.ts
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';

...

@NgModule({
  ...

  providers: [
    ...
    InAppBrowser 
    ...
  ]
  ...
})
export class AppModule { }

Source: https://ionicframework.com/docs/native#angular

like image 143
Nicolai Pefaur Zschoche Avatar answered Oct 02 '22 11:10

Nicolai Pefaur Zschoche