Erstellen und

Question

1. in Ionic pdf zeige ich PDFMAKE bin mit einem Base64 codiert pdf zu erstellen, und ich versuchte es mit dem Iframe zu zeigen, indem die codierten base64 src iframe geben. Es funktioniert auf dem PC, aber es funktionierte nicht auf dem Handy (Android und iOS).

   2. Also, endlich bin ich auf Angularjs-PDF gestoßen, um das pdf zu zeigen. Jetzt kann ich das PDF in Mobile sehen. Aber wenn ich versuche, benutzerdefinierte Breite und Höhe entsprechend dem Gerät zu geben, dauert es. Aber das Problem tritt auf, wenn ich die Zoomfunktion verwende, die Seite wird gezoomt, aber sie geht aus dem Bildschirm. Ich kann nicht einmal rutschen oder wischen, um den Inhalt außerhalb des Bildschirms zu sehen.

Ich möchte mit Zoom-Funktion in Ionic als pdf auf der Client-Seite und eine Vorschau auf Benutzer machen.

Wenn jemand irgendeine Lösung für diese bitte teilen, danke.

Answer 1

Also für unsere Firma App verwenden wir Viewer-Winkel pdf:

Hier ist die Vorlage für die PDF-Viewer-Vorlage, in einem Ionen Scroll-Zoom ermöglicht Prise setzen und es funktioniert super.

<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> 

dann auf der Seite, die das pdf zeigt:

<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> 

Sie füttern die Vorlage in den PDF-Viewer, und es wird auf der Seite angezeigt.

es die richtigen js Dateien zuerst zu verwenden sind:

<script src="bower_components/pdfjs-dist/build/pdf.js"></script> 
<script src="bower_components/angular/angular.js"></script> 
<script src="bower_components/angular-pdf-viewer/dist/angular-pdf-viewer.min.js"></script> 

dann pdf injizieren:

var app = angular.module('App', ['pdf']); 

Sie es mehr um hier lesen können, aber es in Kombination mit Ionen blättern sie mit funktioniert genau wie Sie es auf einem nativen Gerät denken sollte:

https://github.com/winkerVSbecks/angular-pdf-viewer