离子框架PdfViewer

Question

我想为手机开发pdf电子书应用程序。是否有用于离子框架的pdf查看器组件。我喜欢mozilla pdf.js。我需要离子项目的例子。

Answer 1

你有没有尝试过angular模块ng-pdfviewer？因为angular在Ionic的引擎盖下工作。

Answer 2

 var app = angular.module('testApp', [ 'ngPDFViewer' ]);

 app.controller('TestCtrl', [ '$scope', 'PDFViewerService', function($scope, pdf) {
  $scope.viewer = pdf.Instance("viewer");

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

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

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

指令使用了上面的pdf.js文件，超文本标记语言如下：

<button ng-click="prevPage()">&lt;</button>
<button ng-click="nextPage()">&gt;</button>
<br>
<span>{{currentPage}}/{{totalPages}}</span>
<br>
<pdfviewer src="test.pdf" on-page-load='pageLoaded(page,total)' id="viewer"></pdfviewer>

使用ng-pdf应该可以解决您的问题。

Answer 3

你有没有试过这个Phonegap插件https://github.com/ti8m/DocumentHandler？

下面是我是如何使用它的。

 $scope.HandleDocumentPlugin = function () {
    if (DocumentViewer != null) {
        DocumentViewer.previewFileFromUrlOrPath(
            function () {
                console.log('success');
            }, function (error) {
                if (error == 53) {
                    console.log('No app that handles this file type.');
                    var alert = $ionicPopup.alert({
                        title: 'Alert!',
                        template: "There is no app installed that handles this file type."
                    });
                    alert.then(function (res) {

                    });
                }
            }, $scope.PDF_URL);
    }
    else if (DocumentHandler != null) {
        DocumentHandler.previewFileFromUrlOrPath(
           function () {
               console.log('success');
           }, function (error) {
               if (error == 53) {
                   console.log('No app that handles this file type.');
                   var alert = $ionicPopup.alert({
                       title: 'Alert!',
                       template: "There is no app installed that handles this file type."
                   });
                   alert.then(function (res) {

                   });
               }
           }, $scope.PDF_URL);
    }
    else {
        console.log("error");
    }
}