- 离子基础教程
 - 离子 - 主页
 - 离子 - 概述
 - Ionic - 环境设置
 
- Ionic CSS 组件
 - 离子 - 颜色
 - 离子 - 内容
 - 离子 - 标头
 - 离子 - 页脚
 - 离子 - 按钮
 - Ionic - 列表
 - 离子 - 卡片
 - 离子 - 形式
 - 离子 - 切换
 - Ionic - 复选框
 - Ionic - 单选按钮
 - 离子 - 范围
 - 离子 - 选择
 - Ionic - 选项卡
 - 离子 - 网格
 - 离子 - 图标
 - 离子 - 填充
 
- Ionic JavaScript 组件
 - Ionic - JS 操作表
 - Ionic - JS 背景
 - Ionic - JS 内容
 - Ionic - JS 表单
 - Ionic - JS 事件
 - Ionic - JS 标头
 - Ionic - JS 页脚
 - Ionic - JS 键盘
 - Ionic - JS 列表
 - Ionic - JS 加载
 - Ionic - JS 模态
 - Ionic - JS 导航
 - Ionic - JS 弹出窗口
 - Ionic - JS 弹出窗口
 - Ionic - JS 滚动
 - Ionic - JS 侧边菜单
 - Ionic - JS 幻灯片盒
 - Ionic - JS 选项卡
 
- 离子先进概念
 - Ionic - Cordova 集成
 - 离子 - AdMob
 - 离子 - 相机
 - 离子 - Facebook
 - Ionic - 在应用程序浏览器中
 - Ionic - 原生音频
 - 离子 - 地理定位
 - 离子 - 媒体
 - Ionic - 启动画面
 
- 离子有用资源
 - 离子 - 快速指南
 - 离子 - 有用的资源
 - 离子 - 讨论
 
Ionic - Cordova InAppBrowser
Cordova InAppBrowser 插件用于在 Web 浏览器视图中打开应用程序的外部链接。
使用浏览器
开始使用这个插件非常容易。您所需要做的就是打开命令提示符窗口并安装 Cordova 插件。
C:\Users\Username\Desktop\MyApp>cordova plugin add org.apache.cordova.inappbrowser
这一步允许我们开始使用inAppBrowser。我们现在可以创建一个按钮,将我们引导到一些外部链接,并添加一个简单的函数来触发插件。
HTML 代码
<button class = "button" ng-click = "openBrowser()">OPEN BROWSER</button>
控制器代码
.controller('MyCtrl', function($scope, $cordovaInAppBrowser) {
   var options = {
      location: 'yes',
      clearcache: 'yes',
      toolbar: 'no'
   };
   
   $scope.openBrowser = function() {
      $cordovaInAppBrowser.open('http://ngcordova.com', '_blank', options)
		
      .then(function(event) {
         // success
      })
		
      .catch(function(event) {
         // error
      });
   }
})
当用户点击按钮时,InAppBrowser 将打开我们提供的 URL。
此插件还可以使用其他几种方法,下表中列出了其中一些方法。
Cordova $inAppBrowser 方法
| 方法 | 参数 | 类型 | 细节 | 
|---|---|---|---|
| setDefaultOptions(参数1) | 选项 | 目的 | 用于设置所有 InAppBrowser 的全局选项。 | 
| 打开(参数1,参数2,参数3) | URL、目标、选项 | 字符串、字符串、对象 | 共有三个可用目标。_blank将打开新的 inAppBrowser 实例。_system将打开系统浏览器,_self将使用当前浏览器实例。 | 
| 关闭 | / | / | 用于关闭InAppBrowser。 | 
Cordova 应用内浏览器事件
该插件还提供可以与$rootScope组合的事件。
| 例子 | 细节 | 
|---|---|
| $rootScope.$on('$cordovaInAppBrowser:loadstart', function(e, event)); | 当 inAppBrowser 开始加载页面时调用。 | 
| $rootScope.$on('$cordovaInAppBrowser:loadstop', function(e, event)); | 当 inAppBrowser 完成页面加载时调用。 | 
| $rootScope.$on('$cordovaInAppBrowser:loaderror', function(e, event)); | 当 inAppBrowser 遇到错误时调用。 | 
| $rootScope.$on('$cordovaInAppBrowser:退出', function(e, event)); | 当 inAppBrowser 窗口关闭时调用。 |