ionic-framework - 如何使用Ionic 2缩放图像

Question

我的页面上只有一张图像，如何使该图像可缩放？

My Page

Answer 1

您可以将图片查看器用于Ionic 2+

安装

npm install --save ionic-img-viewer

添加到app.module.ts中

import { IonicImageViewerModule } from 'ionic-img-viewer';

@NgModule({
  declarations: [
    MyApp, 
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    IonicImageViewerModule
  ],

编程用法:

< img src="IMAGE_URL" #myImage (click)="presentImage(myImage)" />

import { ImageViewerController } from 'ionic-img-viewer';

export class MyPage {
  _imageViewerCtrl: ImageViewerController;

  constructor(imageViewerCtrl: ImageViewerController) {
    this._imageViewerCtrl = imageViewerCtrl;
  }

  presentImage(myImage) {
    const imageViewer = this._imageViewerCtrl.create(myImage);
    imageViewer.present(); 
  }
}

DEMO : Demo ionic-img-viewer