离子 InAppBrowser。并不总是工作答案

【问题标题】：Ionic InAppBrowser. Not always working离子 InAppBrowser。并不总是工作
【发布时间】：2018-05-09 10:39:04
【问题描述】：

我目前有一个 Ionic 应用程序，它创建一个指向网站的 InAppBrowser。我已经将它部署到我的 Android 手机上，但是有一个大问题。

有时应用程序无法运行，并使用我的默认浏览器打开网站。有时它确实可以使用 InAppBrowser 在应用中打开网站。

我尝试过使用不同的目标 self、blank、system 和不同的 Android 手机，但没有一个完全有效。

我真的很困惑并尝试了很多东西，有什么想法吗？提前致谢。

以下是我的代码文件：

home.html

<ion-header>
  <ion-navbar color="dark">
    <ion-title>
      InAppBrowser
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  InAppBrowser Not Displayed.
</ion-content>

home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { InAppBrowser, InAppBrowserOptions } from "@ionic-native/in-app-browser";

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(public navCtrl: NavController, private inAppBrowser: InAppBrowser) {
      const options: InAppBrowserOptions = {
          toolbar: 'no',
          location: 'no',
          zoom: 'no'
      }

      const browser = this.inAppBrowser.create("https://www.awebsite.co.uk", '_self', options);
  }
}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';

import { InAppBrowser } from '@ionic-native/in-app-browser';

@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    InAppBrowser
  ]
})
export class AppModule {}

【问题讨论】：

标签： android angular ionic-framework ionic2 inappbrowser

【解决方案1】：

您是否尝试等待“平台”“准备好”使用？ https://ionicframework.com/docs/api/platform/Platform/

export class HomePage {

  constructor(public navCtrl: NavController, private inAppBrowser: InAppBrowser, public platform: Platform) {
      const options: InAppBrowserOptions = {
          toolbar: 'no',
          location: 'no',
          zoom: 'no'
      }

     this.platform.ready().then( () => {
        const browser = this.inAppBrowser.create("https://www.awebsite.co.uk", '_self', options);
     })
  }
}

这样做，代码只会在应用准备就绪时运行。在设备环境中，当 Cordova 准备好使用时。

【讨论】：