使用ng2-pdf-viewer在我的應用程序中顯示pdf文件時，放大並縮小在ng2-pdf-viewer

Question

上。

<pdf-viewer [src]="pdfSrc" 
      [page]="page" 
      [zoom]="1.1" 
      style="width: 100%;" 

我想在添加放大和縮小的按鈕。我如何在ng2-pdf-viewer中實現這個功能。

建議任何其他更好的庫，我可以具有角4使用的pdf文件，將不勝感激

Answer 1

予實現的自定義放大和通過改變NG2 PDF的觀看者的[zoom]屬性縮小按鈕

HTML

<pdf-viewer [src]="pdfSrc" 
       [page]="page" 
       [original-size]="true" 
       [zoom]="zoom_to"></pdf-viewer> 

，這裏是在組件級縮放方法

zoom_in() { 
    this.zoom_to = this.zoom_to + 0.25; 
    } 

    zoom_out() { 
    if (this.zoom_to > 1) { 
     this.zoom_to = this.zoom_to - 0.25; 
    } 
    } 

Answer 2

把一件簡單的事情。輕鬆工作。玩的開心！！！

// HTML部分

<pdf-viewer [fit-to-page]="fitToPage" [(page)]="pageVariable" [zoom]="zoom" [autoresize]="autoresize" [show-all]="showAll" [src]="pdfSrc" [render-text]="true" style="display: block"></pdf-viewer> 
    <button ion-button (click)="incrementZoom(-0.1)"> 
     <img src="assets/Zoom_Out.png"/> 
    </button> 
    <button ion-button (click)="incrementZoom(0.1)"> 
     <img src="assets/Zoom_in.png"/> 
    </button> 

// TS的一部分，它會自動改變大小。

zoom: number = 1.0; 
originalSize: boolean = true; 

incrementZoom(amount: number) { 
    this.zoom += amount; }