Return to site

Ionic 2 RC4 and InAppBrowser


Hi Everyone!

Here's some help with this from experience with Ionic 2 RC 4 and latest Angular 2 as of 12/31/2016:

0. Build a brand new v2 app: $ ionic start MyApp blank --v2

1. make sure you have installed the Ionic 2 native (ref: then go to native > inappbrowser page)
$ ionic plugin add cordova-plugin-inappbrowser

2. Make sure you have imported in your src/app/app.component.ts:
import { InAppBrowser } from 'ionic-native';

3. your template/view .html should be something like typical: *************************

<ion-content class="home">
<div class="top-header center">
<ion-icon name="alert"></ion-icon>

My Own App

<div class="center">
<button ion-button="" large="" color="primary" (click)="launchUrl()">Go To Lisaiceland Site</button>

4. Your .ts file should like something typical: *************************

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Platform } from 'ionic-angular';
import { InAppBrowser } from 'ionic-native';

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

constructor(public navCtrl: NavController, public platform: Platform) {
this.platform = platform;

launchUrl() {
this.platform.ready().then(() => {
let ref = new InAppBrowser('',
ref.on('exit').subscribe(() => {
console.log('Exit In-App Browser');


5. save and run in ionic lab ($ ionic serve --lab) to emulate and it should work. Will NOT work in Ionic View though.


6. Build iOS .ipa or Android .apk (android-debug.apk in dev) and run on a PHYSICAL android device and it'll work. I just built it to test just now!

I was very frustrated with all the examples on the net and in stackoverflow no working with a full example.

Happy New Year Everybody! Happy 2017!



All Posts

Almost done…

We just sent you an email. Please click the link in the email to confirm your subscription!

OKSubscriptions powered by Strikingly