6

在阅读了 StackOverFlow 和其他网站(包括 Ionic 文档)中的所有相关帖子后,我无法使其正常工作。我试图复制相同的内容,所以目前我有:

app.module.ts

    import { PhotoViewer } from '@ionic-native/photo-viewer/ngx';        

    @NgModule({
     declarations: [AppComponent],
     entryComponents: [],
     imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
     providers: [
     StatusBar,
     SplashScreen,
     { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },    
     PhotoViewer

  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

home.page.ts

import { PhotoViewer } from '@ionic-native/photo-viewer/ngx';


export class HomePage {

  constructor(private photoViewer: PhotoViewer) { }

  openImage() {
    this.photoViewer.show(''../assets/baluarte.jpg');
} 
}

在 home.page.ts

<ion-content padding>  
  <img src="../assets/baluarte.jpg" (click)="openImage()"/>
 <ion-button (click)="openImage()">View</ion-button>
</ion-content>

我想要实现的是显示图片,当我单击时,Ionic全屏提及您的图像,并能够平移、缩放和共享图像。但是我同时尝试使用具有相同功能的按钮,以确保错误不在图像中。

也在里面

 this.photoViewer.show(''../assets/baluarte.jpg');

我也在尝试使用 url,因为我不确定它是否可以与本地文件一起使用,但它也无法使用

 this.photoViewer.show('https://images.app.goo.gl/cW8jBeX33H9GKAon9.jpg')

我的最终目标是使用本地文件。

PS:我当然安装了

ionic cordova plugin add com-sarriaroman-photoviewer
npm install @ionic-native/photo-viewer

谢谢你的支持

4

1 回答 1

0

虽然这不是 100% 保证的解决方案,但我希望它能引导您朝着正确的方向前进。

我遇到了完全相同的问题,并且由于某种原因,它已经自行解决,而实际上并未对我的代码进行任何修改。

一点上下文:

我有一个使用许多原生 Cordova 插件的大型项目,因此每当我想添加一个新插件时,我总是首先在一个空白项目中对其进行测试,以避免与大项目混淆。所以我创建了一个新的空白项目并测试了 Native PhotoViewer。它按预期在Android模拟器上运行。

然后我转移到我的默认大项目并遵循完全相同的步骤,但没有发生任何事情。我的行为与您的行为完全相同。我正在执行ionic cordova run android -l -c,但它不起作用。所以我唯一做的就是ctrl + c(取消进程)然后执行ionic cordova run android -l -c,问题神奇地消失了。

可以解决此类问题的步骤:

虽然我还没有设法了解问题出在哪里,但在这种情况下或类似问题中,我建议您按照以下步骤进行故障排除:

  1. 停止进程并重新运行
  2. 转到 Android 设备或 Android 模拟器(您正在测试您的应用程序),手动卸载该应用程序,然后再次执行以在其中运行(有时干净的部署可能会解决问题)
  3. 我注意到有时插件不在run模式下工作,而是在生成的debugAPK 或signedAPK 中工作。(两者都值得尝试)
  4. 有时插件可能无法使用-l,-livereload标志。因此,在没有这两者的情况下也值得尝试这样做。
  5. 检查您是否拥有最新版本的 Angular、插件和 Ionic。就您而言(这是一个老问题,因此您可能已经找到了解决方案),但是如果您尚未更新 Ionic,我建议您更新到最新的 Ionic CLI 和 Ionic Framework
  6. 最后,最后的故障排除路径是创建一个完全空白的项目(当然所有内容都更新到最新的稳定版本),然后在那里测试插件。如果插件有效,您将两个项目的配置并排放置并尝试查看差异。这种方法帮助我意识到需要将 Angular 升级到版本 9 才能使其正常工作。(当然,相应的库也需要升级,以匹配 Angular 9 版本)

我希望这篇文章能指导您或其他有类似问题的人找到正确的故障排除路径。祝你好运!

于 2020-06-08T17:07:04.563 回答