Ionic/TypeScript应用本地生成视频缩略图无法正常显示问题求助

我在开发Ionic应用时遇到了缩略图无法显示的问题，在安卓设备上模拟运行、真机安装启动都无法正常加载，调整[ion-img]的src参数也未解决问题。
该Ionic应用结构简单，仅包含homepage.html和对应的ts文件，所有功能运行正常，唯独缩略图无法展示，相关ts代码如下：

async startRecord(){
    console.log("Entering record x");
    let base64 = null;
    const option: CaptureVideoOptions = {
      limit: 1,
      duration: 5,
      quality: 100
    };
    var dateObj = new Date();
    var minutes = dateObj.getMinutes().toString();
    let minStr = "";

    if(minutes.length<=1){
      minStr = "0" + minutes;
    }
    else{
      minStr = minutes;
    }
    var date = "Date: " + dateObj.getMonth() + "-" +  dateObj.getDate() + "-" + dateObj.getFullYear() + " Time: " + dateObj.getHours() + ":" + minStr;
    console.log("date",date);
    const id:string = uuid();

    this.mediaCapture.captureVideo(option).then(async (mediaFile: MediaFile[]) => {
      this.video = mediaFile[0];
      this.keys = Object.keys(this.video);
   
      await this.createThumbnail(this.video?.fullPath);
      const video = {
        id: id,
        fullPath: this.video?.fullPath,
        name: this.video?.name,
        userLabel: 'undecided',
        thumbnail: this.thumbnail,
        serverLabel: "none",
        size: this.video?.size,
        dateVideoTaken: date,
      };
      console.log(video);
      await this.util.storeVide(video);
      await this.getAllVideos();
    }, (error: CaptureError) => {
      console.log(error.code);
      alert(error.code);
    });
  }

我调用了video-capture的createThumbnail方法，运行无报错，通过console.log验证了缩略图已在模拟器和真机上成功生成，手动查看手机存储路径也确认缩略图文件真实存在，相关代码如下：

async createThumbnail(path){
    console.clear();
    console.log('Full Video Path ', path);
    var numstr = new Date().getTime();
    var option:CreateThumbnailOptions = {fileUri: path ,width:160, height:206, atTime:1, outputFileName: 'thumbnail' + numstr, quality:100 };
    const thumbnail = await this.VideoEditor.createThumbnail(option);
    console.log("Thumbnail desc.", thumbnail);
    this.thumbnail = thumbnail;
  }

我在HTML页面中使用如下代码渲染对应视频的缩略图：

<ion-thumbnail slot="start" class="customized-image" id="thumbnail" (click)="openVideo(video.fullPath)" > 
    <!-- <img src="https://gravatar.com/avatar/dba6bae8c566f9d4041fb9cd9ada7741?d=identicon&f=y"> -->
    <img src="{{video?.thumbnail}}">
</ion-thumbnail>

使用gravatar的通用缩略图链接时显示完全正常，但绑定本地生成的缩略图路径时就无法加载。
我花费一整天排查该问题都没有解决，若以上信息不足以完整描述问题，可以补充更多相关代码。
另外说明：我的电脑f键损坏，因此文本中存在拼写错误，需要用到f字符时我都是通过复制粘贴输入的。
控制台日志示例如下：

内容的提问来源于stack exchange，提问作者Alejandro Delmonte