ionic 打开外部页面的三种方式（已知）

一.iframe

注意事项：

1.iframe的src属性用ng-src属性替代，并指明绑定对象：ng-src="{{targetUrl}}"

2.在controller里，调用$sce: $scope.targetUrl = $sce.trustAsResourceUrl(url);

缺点：交互不友好，引入的外部链接页面和ionic框架自身产生的冲突太多。

二.cordova-plugin-inappbrowser   cordova插件

使用方法：

cordova.InAppBrowser.open(URL,target,options)

open()中的URL参数为浏览器跳转的地址；

target的参数有三种：

_self：如果URL地址在WhiteList中，则用Cordova的WhiteList将其打开；

_blank：直接在App中将其地址打开；

_system：则是用手机默认浏览器将新页面打开

options参数包含以下信息：

 location：设置为yes或no来打开或关闭插件的locationbar；

 hidden：设置为yes则加载出页面但不显示；设置为no则正常加载页面；

Android独有属性：

zoom：设置为yes则显示缩放浏览器页面的按钮，设置为no则不显示缩放按钮；

hardwareback：设置为yes则调用Android返回键回到前一界面，设置为no则返回键为退出浏览器页面；

iOS独有属性：

closebuttoncaption：设置yes则显示Done按钮，设置为no则隐藏Done按钮，点击Done按钮关闭浏览器页面；

toolbar：设置为yes则显示toolbar；no则隐藏toolbar（toolabar相当于Android的返回键功能）；

keyboardDisplayRequiresUserAction：设置为yes或者no来控制打开键盘时是否通过JavaScript调用focus()接收焦点，默认为yes；

toolbarposition：设置为top或者bottom，使工具栏显示在窗口的顶部或底部；

缺点：在APP中打开内置浏览器时，头部的浏览器导航样式无法自定义；

三.cordova-plugin-themeablebrowser cordova插件(简直就是上面二的升级版)

基本上和cordova-plugin-inappbrowser使用上没有区别，但是 可以 自定义浏览器的导航样式

具体使用请直接查看：

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