Ionic和InAppBrowser无法工作

时间:2015-10-16 11:35:58

标签: android url ionic-framework

我需要在离子应用程序中包装一个URL。我用windows 8测试,在chrome broswer里面。

  • 在Windows Chrome上:重定向到浏览器中的页面
  • 在Android手机上:在控制台中没有任何警告或其他任何内容关闭应用程序。

请在不使用iframe的情况下为我提供所需的解决方案。

我遵循了每个文档给我的所有信息,这就是我实现它的方式:

app.js档案:

// Ionic Starter App

// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
angular.module('starter', ['ionic', 'ngCordova'])

  .run(function($ionicPlatform) {
    $ionicPlatform.ready(function() {
      // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
      // for form inputs)
      if (window.cordova && window.cordova.plugins.Keyboard) {
        cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      }

      if (window.StatusBar) {
        StatusBar.styleDefault();
      }
    });
  })

  .controller('CheckController', function($scope, $cordovaInAppBrowser) {
    if (navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry)/)) {
      document.addEventListener("deviceready", onDeviceReady, false);
    } else {
      onDeviceReady();
    }



    function onDeviceReady() {


      window.open = $cordovaInAppBrowser.open('http://apache.org', '_self', {
          location: 'no',
          hidden: 'yes'
        }).then(function(event) {
          alert('success');
        })
        .catch(function(event) {
          console.log(event);
        });
    }
  });
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
  <title></title>

  <link href="lib/ionic/css/ionic.css" rel="stylesheet">
  <link href="css/style.css" rel="stylesheet">

  <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

  <!-- ionic/angularjs js -->
  <script src="lib/ionic/js/ionic.bundle.js"></script>

  <!-- cordova script (this will be a 404 during development) -->
  <script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
  <script src="cordova.js"></script>

  <!-- your app's js -->
  <script src="js/app.js"></script>
</head>

<body ng-app="starter">

  <ion-pane>
    <ion-header-bar class="bar-stable">
      <h1 class="title">Lunch External App Demo</h1>
    </ion-header-bar>
    <ion-content ng-controller="CheckController">
      <div id="map" data-tap-disabled="true"></div>

    </ion-content>
  </ion-pane>

</body>

</html>

1 个答案:

答案 0 :(得分:0)

这适用于Android:

&#13;
&#13;
 ionic.Platform.ready(function(){
            // will execute when device is ready, or immediately if the device is already ready.
            onDeviceReady3();
        });

function onDeviceReady3(){
            var options = {
                location: 'no',
                clearcache: 'no',
                toolbar: 'yes', //only for IOS
                hidden:'yes'
            };
               
                $cordovaInAppBrowser.open('http://google.com', '_self', options)
                    .then(function(event) {
                        // success
                        alert("success");
                    })
                    .catch(function(event) {
                        // error
                        alert("error");
                    });
                $cordovaInAppBrowser.close();
        }
&#13;
&#13;
&#13;