cordova打开外部链接_ionic2使用ThemeableBrowser插件实现app内打开外部链接

ThemeableBrowser插件主要是用于app内打开新浏览器或者说嵌入一个浏览器到app内，这个插件很好用，不过有个缺点，就是在android下无法控制状态栏的颜色，ios下可以控制，其他的都非常不错，很适合用于在app内打开外部链接，这个插件延续了InAppBrowser插件

为什么要使用这个插件，主要原因是ionic2官方也很好的支持了这款插件。

1、在ionic中使用

先安装以下ionic插件

ionic cordova plugin add cordova-plugin-themeablebrowser

npm install --save @ionic-native/themeable-browser

2、首先在app.module.ts引入此插件

import { ThemeableBrowser, ThemeableBrowserObject } from '@ionic-native/themeable-browser';

在providers: []中加入ThemeableBrowser，如下

providers: [

...

ThemeableBrowser,

...

]

3、在需要使用的地方再次引入此插件，比如我再openurl.ts这个组件中引入

import { Component, OnInit } from '@angular/core';

import { ThemeableBrowser, ThemeableBrowserObject } from '@ionic-native/themeable-browser';

export class jobInfo implements OnInit{

private options = {

//这里我仅仅定义了状态栏颜色(ios下有效)和关闭按妞，以及工具条的颜色和标题颜色

statusbar: {

color: '#008B8B'

},

toolbar: {

height: 44,

color: '#008B8B'

},

title: {

color: '#ffffff',

showPageTitle: true

},

closeButton: {

image: 'close',

imagePressed: 'close_pressed',

align: 'left',

event: 'closePressed'

},

backButtonCanClose: true

};

constructor(private themeableBrowser: ThemeableBrowser){

}

goBrowser(url){

let web_url='http://www.egtch.com'

let browser: ThemeableBrowserObject = this.themeableBrowser.create(web_url, '_self',

this.options);

}

如果需要更多工具(比如返回、前进、自定义按妞等)，请到插件官方查看！

http://ionicframework.com/docs/native/themeable-browser/

https://github.com/initialxy/cordova-plugin-themeablebrowser