No provider error when using Capacitor and Cordova plugin InAppBrowser-CodePudding

I'm stucked using Cordova plugin InAppBrowser

My project setup is Angular 13 Capacitor for android build which is working fine until I tried to use InAppBrowser plugin.

I was following instructions on link above, but with no success.

import { InAppBrowser } from '@awesome-cordova-plugins/in-app-browser/ngx';
...
constructor(
        private fb: FormBuilder,
        private iab: InAppBrowser
    ) {}
...
redirectMe = async () => {
        console.log('redirect init');
        const options: any = {
            location: 'no',
            clearcache: 'yes',
            zoom: 'yes',
            toolbar: 'yes',
            closebuttoncaption: 'close'
        };

        console.log('redirect me triggered');
        const browser = this.iab.create(
            'https://somelink.com',
            '_blank',
            options
        );

        console.log('opened');
        console.log('browser=>');
        browser.on('loadstop').subscribe(() => { ... do something});

I'm getting this error on runtime:

ERROR NullInjectorError: R3InjectorError(HomeModule)[InAppBrowser -> InAppBrowser -> InAppBrowser -> InAppBrowser]: NullInjectorError: No provider for InAppBrowser!

When I put InAppBrowser in providers into app.module.ts:

import { InAppBrowser } from '@awesome-cordova-plugins/in-app-browser';
...
providers: [
        InAppBrowser
       ...
]

I'm getting following error:

main.ts:14 Error: Invalid provider for the NgModule 'AppModule' - only instances of Provider and Type are allowed, got: [?[object Object]?, ..., ..., ..., ..., ...] at throwInvalidProviderError (core.mjs:249:1)

Do you have any idea why is that and how can I use InAppBrowser plugin with Capacitor&Angular?

CodePudding user response：

in app.module.ts, replace

import { InAppBrowser } from '@awesome-cordova-plugins/in-app-browser';

with

import { InAppBrowser } from '@awesome-cordova-plugins/in-app-browser/ngx';

always check the plugins imports manually, because with auto import, it usually misses the ngx.