簡単にimage viewerを表示するmage viewer for Ionic 2+

ionic2で、簡単いimage viewerを表示する事が出来るpluginを紹介します。ionic-img-viewerです。imgタグに、imageViewer を指定するだけでViwerが表示されます。
詳細は、ionic-img-viewerを参照して下さい。

インストール＞

npm install --save ionic-img-viewer

利用方法＞

importにIonicImageViewerModuleを追加する。
import { IonicImageViewerModule } from 'ionic-img-viewer';
@NgModule({
  imports: [
    IonicImageViewerModule
  ]
})
export class AppModule {}

あとは、HTMLのimgタグにimageViewerを指定するだけです。

<img src="IMAGE_URL" imageViewer />

※ただし、ソースに一部不具合が有る様です。ソースを一部変更しました。そのまま実行すると、rxjs/operatorsが解決出来ないエラーが発生しました。なので、一部ファイルを変更します。
変更するファイルは、プロジェクト配下にある「node_modules/ionic-img-viewer/dist/es2015/src/image-viewer-impl.js」です。

import { delay, zip } from 'rxjs/operators'; => rxjs/operatorでsを取ります。

これで、実行可能です。

ブログ

カテゴリ