選擇后，離子不顯示圖庫中的照片

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>

離子：

離子 CLI : 6.16.3 (/usr/local/lib/node_modules/@ionic/cli) 離子框架
：@ionic/angular 5.6.7 @angular-devkit/build-angular：0.1000.8
@angular-devkit/schematics：10.0.8 @angular/cli
：10.0.8 @ionic/angular-toolkit：2.3.3

電容器：

電容器 CLI：3.0.0 @capacitor/android：3.0.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 大蘇爾

Answer 1

記得有類似的問題。 使用 Base64 而不是 URI 為我解決了這個問題。