Angular 在ng2 pdf查看器中放大和缩小

Angular 在ng2 pdf查看器中放大和缩小,angular,pdf,Angular,Pdf,我正在使用ng2 pdf viewer在我的应用程序中显示pdf文件 <pdf-viewer [src]="pdfSrc" [page]="page" [zoom]="1.1" style="width: 100%;" 通过更改ng2 pdf viewer的[zoom]属性,我实现了自定义放大和缩小按钮 html 放一个简单的一件事。容易操作。玩得开心 //html部分 <pdf-viewer [fit-to-page]=

我正在使用ng2 pdf viewer在我的应用程序中显示pdf文件

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

通过更改ng2 pdf viewer的
[zoom]
属性,我实现了自定义放大和缩小按钮

html


放一个简单的一件事。容易操作。玩得开心

//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>
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;
    }
  }
<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>
zoom: number = 1.0;
originalSize: boolean = true;

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