我有一个Angular 的应用程序，我试图插入到一个 IndexedDB 。问题是数据库没有得到创建。
下面是我在数据库中插入一个条目的一段代码。

createImageFromBlob(ficname:any , image: Blob) {
    let reader = new FileReader();
    reader.addEventListener("load", (evt) => {
      let res = evt.target.result;

      // Store Data URL in localStorage
      try {
        if (typeof res === "string") {
          localStorage.setItem(ficname, res);
          this.dixieDbService.addNewImage(ficname, res).then(r => console.log("inserted: "));
        }
      }
      catch (e) {
        console.log("Storage failed: " + e);
      }
    }, false);
    if (image) {
      reader.readAsDataURL(image);
    }
  }

下面是bd.ts

import Table = Dexie.Table;
import Dexie from "dexie";

export interface ImageList {
  id?: number;
  imgName: string;
  imgDataUrlValue: string|ArrayBuffer;
}

export class AppDB extends Dexie {
  imageList!: Table<ImageList, number>;

  constructor() {
    super('ngdexieliveQuery');
    this.version(3).stores({
      imageList: '++id'
    });
   // this.on('populate', () => this.populate());
  }
  
}

export const db = new AppDB();

以下是服务类：

import {Injectable} from "@angular/core";
import {liveQuery} from "dexie";
import {db, ImageList} from "../dixie/db";

@Injectable()
export class DixieIndexedDbService {

  imageList$ = liveQuery(() => db.imageList.toArray());
  listName = 'My local image list';

  async addNewImage(imgName:string, imgDataVal:any) {
    await db.imageList.add({
      imgName: imgName,
      imgDataUrlValue:imgDataVal
    });
  }

  async getImgDataValue(imgName:string) {
    return db.imageList.get({imgName: imgName});
  }

}

我有stackblitz上的示例工作代码：
https://stackblitz.com/edit/angular-ivy-znzhv8