Ionic和ngCordova FileOpener2插件问题

时间:2015-08-19 14:39:52

标签: ios ionic ngcordova

我目前正在使用Ionic Framework构建应用程序。我需要能够打开PDF格式。我正在使用ngCordova Plugin FileOpener2执行此任务。

我没有收到任何错误和成功消息,我提示显示。

这是我的控制者:

module.controller('NewsCtrl', function ($cordovaFileOpener2) {

    $cordovaFileOpener2.open(
         '../img/Newsletter.pdf',
         'application/pdf'
     ).then(function() {
          console.log('Success');
     }, function(err) {
          console.log('Error' + err );
     });

});

我目前在模拟器中使用命令ionic emulate ios运行它--livereload --target =" iPhone-4s"

我也在具有类似结果的实际设备中对其进行了测试。

我在更改某些文件时遇到了错误,而livereload服务器使用控制器刷新了选项卡上的应用程序并收到错误:

  

错误:undefined不是对象(评估' cordova.plugins.fileOpener2')

3 个答案:

答案 0 :(得分:1)

不需要那个复杂的插件!在我们公司的应用程序中,我们也需要能够打开pdf / s。我们使用https://github.com/sayanee/angularjs-pdf。它很奇妙。这是它在android上的样子。

enter image description here

它也适用于ios:它还允许您不必离开应用程序打开PDF。您还可以捏,缩放,旋转。这是代码的样子。

PDFViewer.html

 <ion-view>
    <div class="bar bar-header bar-positive">
        <button ng-click="$ionicGoBack()" class="button button-clear button-light icon-left ion-chevron-left">Go Back</button>
    </div>
    <div class="has-header">
        <ng-pdf template-url="components/pdfviewer/viewer.html" canvasid="pdf" scale="0.675">
        </ng-pdf>
    </div>
</ion-view>

Viewer.html

 <div ng-show="notLoaded" class=" center bar bar-subheader">
    <h1 class="title">Loading PDF...</h1>
</div>
<div class="tabs tabs-icon-left">
    <a class="tab-item" ng-click="goPrevious()">
        <i class="icon ion-arrow-left-c"></i> Prev
    </a>
    <a class="tab-item" ng-click="goNext()">
        <i class="icon ion-arrow-right-c"></i> Next
    </a>
</div>

<ion-scroll zooming="true" direction="xy" class="has-header">
    <canvas class="padding" id="pdf" class="rotate0"></canvas>
</ion-scroll>

viewer.controller.js

 //variable that shows and hides the pdf loading bar
$scope.notLoaded = true;

//grabs the pdfUrl
$scope.pdfUrl = ffService.pdfLink;

//sets the position of the pdf viewer controls
$scope.getNavStyle = function (scroll) {
    if (scroll > 100) return 'pdf-controls fixed';
    else return 'pdf-controls';
};

//do something on pdf progress
$scope.onProgress = function (progress) {

}

//do something once the pdf is loaded, I use this to show and hide
//the loading... header on android
$scope.onLoad = function () {
    $scope.notLoaded = false;
}

//error logger for pdf viewer
$scope.onError = function (error) {
    $scope.showCustomAlert('Something went wrong', '<div class="center">' + error + '</div>');
};

然后你只需在你的html中包含js文件并将'pdf'注入你的顶级模块

angular.module('ffApp', ['ionic', 'controllers', 'services', 'ngCordova', 'pdf', 'ngSanitize', 'ngImgCrop', 'chart.js', 'ionic.service.core', 'ionic.service.push']);

答案 1 :(得分:0)

我可能会迟到,但对于正在寻找答案的人来说。发生此错误是因为控制器加载速度比离子速度快。这些插件仅在$ionicPlatform.ready()之后可用。所以在平台准备好之后调用这些插件。

答案 2 :(得分:0)

另一个非常非常晚的答案。

我遇到了同样的问题...只是因为他的插件未正确安装! 再次删除和添加ios平台可能会有帮助。

codorva platform remove ios
cordova platform add ios