Ionic在选择后未显示图库中的照片

Question

我正试图从图库中获取一张照片，以显示在我的屏幕上，我正在处理的页面是一个选项卡页面，使用以下代码我可以打开照片库并选择图像，但是，除非我切换选项卡，否则图像永远不会显示在屏幕上，任何关于如何解决此问题的想法都将不胜感激。

import { Component } from '@angular/core';
import { Camera, CameraResultType, CameraSource } from '@capacitor/camera';
@Component({
selector: 'app-sign-reader',
templateUrl: './sign-reader.page.html',
styleUrls: ['./sign-reader.page.scss']
})

export class SignReaderPage {
myImage = null;
constructor() {}
async takePicture() {
const image = await Camera.getPhoto({
quality: 90,
allowEditing: false,
resultType: CameraResultType.Uri,
source: CameraSource.Photos
});
this.myImage = image.webPath;
}
}

这是HTML代码：

<ion-header>
<ion-toolbar color="primary">
<ion-title>
Capacitor PWA
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-button (click)="takePicture()" expand="block">
<ion-icon name="camera" slot="start"></ion-icon>
Capture image
</ion-button>
<ion-img *ngIf="myImage" [src]="myImage"></ion-img>
</ion-content>

Ionic:

Ionic CLI:6.16.3(/usr/local/lib/node_modules/@ionic/cli(ionic Framework
:@ionic/angular 5.6.7@angular devkit/build angular：0.1000.8
@angular devkit/schemicals:10.0.8@angular/cli
:10.0.8@ionic/angular toolkit:2.3.3

电容器：

电容器CLI:3.0@电容器/android:3.0
@电容器/核心：3.0.0@电容/ios:3.0.0

实用程序：

cordova res：未全局安装
本机运行(可用更新：1.4.0(：1.3.0

系统：

NodeJS:v14.15.4(/usr/local/bin/node(npm:6.14.10操作系统
:macOS Big Sur

Answer 1

记得有过类似的问题。使用Base64而不是URI为我解决了这个问题。