TypeError: Cannot read property 'ready' of undefined-IONIC2

Question

I'm trying to implement InAppBrowser in IONIC2.

Fetched Browser Plugin

ionic plugin add cordova-plugin-inappbrowser

My .TS code to open browser

browser(url:string)
{
  this.platform.ready().then(() => {
           open(url, "_blank", "location=true");
        });

}

my HTML code

 <button (click)="browser('https://www.google.com')" >Open Browser</button>

while trying to execute

the following error coming

ORIGINAL EXCEPTION: TypeError: Cannot read property 'ready' of undefined

ORIGINAL STACKTRACE:
TypeError: Cannot read property 'ready' of undefined
    at HomePage.browser (http://10.44.71.150:8100/build/js/app.bundle.js:180:22)
    at DebugAppView._View_HomePage0._handle_click_27_0 (HomePage.template.js:500:28)
    at http://10.44.71.150:8100/build/js/app.bundle.js:26022:24
    at http://10.44.71.150:8100/build/js/app.bundle.js:34969:36
    at http://10.44.71.150:8100/build/js/app.bundle.js:35039:93
    at ZoneDelegate.invoke (http://10.44.71.150:8100/build/js/zone.js:323:29)
    at Object.onInvoke (http://10.44.71.150:8100/build/js/app.bundle.js:30600:41)
    at ZoneDelegate.invoke (http://10.44.71.150:8100/build/js/zone.js:322:35)
    at Zone.runGuarded (http://10.44.71.150:8100/build/js/zone.js:230:48)
    at NgZoneImpl.runInnerGuarded (http://10.44.71.150:8100/build/js/app.bundle.js:30633:78)

Is there something I'm missing ?

Answer 1

Are you initializing the platform variable in the constructor of your .ts?

Make sure you are importing it first, like this:

import {Platform, ...} from 'ionic-angular';

And then in the constructor:

constructor(private platform: Platform, ...) {
    ....
}

Answer 2

I encountered this issue as well. The tutorial I was using instructed me to add this code to the class declaration:

  static get parameters() {
        return [[Platform]];
    }

Removing this code prevented the error, and InAppBrowser worked smoothly afterwards.

I realize that this response is late, but I hope it may help someone else who runs into this issue.

Answer 3

I had to mark the variables in the constructor as private for them to work properly for myself.

  browser(private url:string, private platform: Platform)
  {
    this.platform.ready().then(() => {
       open(url, "_blank", "location=true");
    });