在ionic应用中打开外部网站（使用InAppBrowser插件）

在安卓上试了一下，如果直接window.open(url)， 在app中点击外部链接没有任何反应。

 

安装https://github.com/apache/cordova-plugin-inappbrowser
执行命令：
ionic plugin add cordova-plugin-inappbrowser

简而言之，就是用window.cordova.InAppBrowser.open替换window.open

 

步骤：

1. 在应用程序启动的时候判断window.cordova是否存在如果是重写window.open方法

 

2. 用ng-click="openLink(story.url)" 替换先前的href

 

3. 在$scope中定义openLink方法。

4.  连上手机， 运行ionic run android测试 

文件一： www/index.html

<div class="list">
      <a ng-click="openLink(story.url)" class="item item-thumbnail-left item-text-wrap"
         ng-repeat="story in stories track by story.id">
        <img ng-src="{{story.thumbnail}}" ng-if="story.thumbnail.startsWith('http')"/>
 
        <h2>{{story.title}}</h2>
 
        <p>
          <span am-time-ago="story.created_utc" am-preprocess="unix"></span> - {{story.domain}}
        </p>
      </a>
    </div>

 文件二: www/js/app.js

(function () {
  var app = angular.module('myreddit', ['ionic', 'angularMoment']);
  app.controller('RedditCtrl', function ($http, $scope) {
    $scope.stories = [];
 
    function loadStories(params, callback) { 。。。
    }
 
    $scope.loadOlderStories = function () {。。。
    }
 
    $scope.loadNewerStories = function () {。。。
    }
 
    $scope.openLink = function (url) {
      window.open(url, '_blank');
    }
 
  });
  app.run(function ($ionicPlatform) {
    $ionicPlatform.ready(function () {
     。。。
      if (window.cordova && window.cordova.InAppBrowser) {
        window.open = window.cordova.InAppBrowser.open;
      }
。。。
    });
  })
 
})();