使用 Angular 7 在 IndexedDB 中添加值

Question

首先，我尝试了与该主题相关的所有问题和答案。此外，我尝试了相关问题并尝试解决但没有成功。所以请仔细阅读我的问题。

首选链接

与链接相关的搜索

我想在indexeddb中添加数据，但不知何故显示数据库连接打开错误。我附上了一个 screenshot.so 我要求回答一个小例子在 indexeddb 中增加价值。

我的代码

app.components.js

import { Component, OnInit } from '@angular/core';
import { NgxIndexedDB } from 'ngx-indexed-db';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  title = 'indexDb-Angular';


  ngOnInit() {
    let  db = new NgxIndexedDB('DVdb', 1);
    db.openDatabase(1, evt => {
      let objectStore = evt.currentTarget.result.createObjectStore('people', { keyPath: 'id', autoIncrement: true });

      objectStore.createIndex('name', 'name', { unique: false });
      objectStore.createIndex('email', 'email', { unique: true });

    });

    db.add('people', { name: 'Sumit', email: 'Sumit@test.com' }).then(
      () => {
          // Do something after the value was added
      },
      error => {
          console.log(error);
      }
  );
  }

}

Answer 1

使 openDatabase() 成为异步方法，以便它在添加值之前等待数据库打开。您可以使用 .then(function() {

使其异步

ngOnInit() {
    let  db = new NgxIndexedDB('DVdb', 1);
    db.openDatabase(1, evt => {
      let objectStore = evt.currentTarget.result.createObjectStore('people', { keyPath: 'id', autoIncrement: true });

      objectStore.createIndex('name', 'name', { unique: false });
      objectStore.createIndex('email', 'email', { unique: true });

    }).then(function () {
        db.add('people', { name: 'Sumit', email: 'Sumit@test.com' }).then(
          () => {
              // Do something after the value was added
          },
          error => {
              console.log(error);
          }
        );
    });
}

使用 Angular 7 在 IndexedDB 中添加值

add value in IndexedDB using Angular 7

indexeddb

angular

angular6

angular7