【问题标题】:ng-pdfviewer downloads pdf instead of displaying pdf in ionic applicationng-pdfviewer 下载 pdf 而不是在 ionic 应用程序中显示 pdf
【发布时间】:2015-12-28 07:34:46
【问题描述】:

我正在尝试在我的 ionic 项目中集成一个嵌入式 pdf 文件,以便用户可以直接在应用程序中读取 pdf 文件,但在实现 ng-pdfviewer 之后,pdf 文件不会显示在 android 手机上当我尝试在像 mozilla firefox 这样的 Web 浏览器模拟器上查看应用程序时,它会下载而不是显示 波纹管是我的控制器和查看页面的 sn-p

.controller('BookController',[ '$scope', 'PDFViewerService', function($scope, pdf) {
  console.log('TestController: new instance');

  $scope.pdfURL = "pdf/Maths_High_School_Science_Texts.pdf";

  $scope.instance = pdf.Instance("viewer");

  $scope.nextPage = function() {
    $scope.instance.nextPage();
  };

  $scope.prevPage = function() {
    $scope.instance.prevPage();
  };

  $scope.gotoPage = function(page) {
    $scope.instance.gotoPage(page);
  };

  $scope.pageLoaded = function(curPage, totalPages) {
    $scope.currentPage = curPage;
    $scope.totalPages = totalPages;
  };

  $scope.loadProgress = function(loaded, total, state) {
    console.log('loaded =', loaded, 'total =', total, 'state =', state);
  };
}])
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<ion-view view-title="{{pdfName}}">
  <ion-content class="padding">

<div class="" ng-controller="BookController">
  <h3>{{pdfName}}</h3>
  <!-- <div class="card"> -->

<!--   <div class="slide-animate" ng-include="'pdf/1.html'"></div>

</div> -->
<div ng-controller="BookController" class="text-center container">
      <div class="row">
        <div class="btn-group">
          <button class="btn" ng-click="pdfURL='test.pdf'">Load test.pdf</button>
          <button class="btn" ng-click="pdfURL='test2.pdf'">Load test2.pdf</button>
        </div>
        <div class="btn-group">
          <button class="btn" ng-click="gotoPage(1)">|&lt;</button>
          <button class="btn" ng-click="prevPage()">&lt;</button>
          <button class="btn" ng-click="nextPage()">&gt;</button>
          <button class="btn" ng-click="gotoPage(totalPages)">&gt;|</button>
        </div>
      </div>
      <div class="row">
        <span class="label" ng-show="totalPages">{{currentPage}}/{{totalPages}}</span>
      </div>
      <div class="row">
        <pdfviewer src="{{pdfURL}}" on-page-load='pageLoaded(page,total)' id="viewer" load-progress='loadProgress(loaded, total, state)'></pdfviewer>
      </div>
    </div>
  </div>
  </ion-content>
</ion-view>

【问题讨论】:

    标签: javascript android angularjs pdf ionic-framework


    【解决方案1】:

    在互联网上搜索答案并联系 ng-pdfviewer 背后的开发人员 Andreas Krennmair 后,我意识到问题出在与 mozilla 浏览器集成的插件上,它拦截了 pdf 文件并在 ionic 能够呈现它之前下载它,所以我禁用了 mozilla firefox 的 IDM 下载管理器插件,结果很好,---就像魔术一样:)

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-01-11
      • 2016-01-17
      • 2018-11-10
      • 2019-10-15
      • 1970-01-01
      • 2019-05-07
      • 2016-07-31
      • 2015-08-17
      相关资源
      最近更新 更多