pdf 未在 cordova themeableBrowser 中打开

Question

我在ionic 2中看到了一些教程，用于打开用户不应下载的pdf。所以我找到了这个 Git 中心存储库。

现在，当我下载项目并运行示例应用程序时，pdf 无法以themeableBrowser打开..

它具有所有浏览器功能，例如：

在应用程序浏览器中

主题浏览器

安卓文档

但是当我尝试inAppBrowser它工作正常时。但是我需要与themeableBrowser一起工作，因为我需要一个pdf不应该是可下载的。如果有人清除我的这个问题，为什么它没有在 Android 平台上打开。

您可以下载存储库，也可以使用它。

请帮帮我。 这是我发现唯一有效的来源。谢谢

Answer 1

如 ionic 文档中所述，您可以使用此themeablebrowser与您尝试使用的 cordova 主题浏览器相同。

以下是工作代码片段：

在home.html文件中：

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>
<ion-content>
    <button ion-button (click)="test()">Test browser</button>
</ion-content>

在home.ts文件中：

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { InAppBrowser } from '@ionic-native';
import { ThemeableBrowser, ThemeableBrowserOptions, ThemeableBrowserObject } from '@ionic-native/themeable-browser';
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
    constructor(public navCtrl: NavController, private themeableBrowser: ThemeableBrowser) {
  }
  test() {
      const options: ThemeableBrowserOptions = {
          statusbar: {
              color: '#ffffffff'
          },
          toolbar: {
              height: 44,
              color: '#f0f0f0ff'
          },
          title: {
              color: '#003264ff',
              showPageTitle: true
          },
          backButton: {
              image: 'back',
              imagePressed: 'back_pressed',
              align: 'left',
              event: 'backPressed'
          },
          forwardButton: {
              image: 'forward',
              imagePressed: 'forward_pressed',
              align: 'left',
              event: 'forwardPressed'
          },
          closeButton: {
              image: 'close',
              imagePressed: 'close_pressed',
              align: 'left',
              event: 'closePressed'
          },
          customButtons: [
              {
                  image: 'share',
                  imagePressed: 'share_pressed',
                  align: 'right',
                  event: 'sharePressed'
              }
          ],
          menu: {
              image: 'menu',
              imagePressed: 'menu_pressed',
              title: 'Test',
              cancel: 'Cancel',
              align: 'right',
              items: [
                  {
                      event: 'helloPressed',
                      label: 'Hello World!'
                  },
                  {
                      event: 'testPressed',
                      label: 'Test!'
                  }
              ]
          },
          backButtonCanClose: true
      };
      const browser: ThemeableBrowserObject = this.themeableBrowser.create('https://docs.google.com/viewerng/viewer?url=www.pdf995.com/samples/pdf.pdf', '_blank', options);
  }
}

并在app.module.ts文件中将ThemeableBrowser从@ionic-native/themeable-browser添加到提供程序。

添加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 { ThemeableBrowser } from '@ionic-native/themeable-browser';
import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    ThemeableBrowser,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

这就是您在启动的 ionic 应用程序中需要的所有添加功能，以便您的主题浏览器正常工作。

Tested it on android emulator.