Как исправить 'TypeError: Невозможно прочитать свойство' then 'из неопределенного TypeError: Невозможно прочитать свойство' then 'из undefined ...'

Question

Я собираюсь создать приложение Ionic Inventory Management с помощью сканера штрих-кода и SQLite с помощью этого руководства: https://www.techiediaries.com/ionic-cordova-sqlite-barcode-scanner-product-inventory-manager/

Когда я добавляю этот код:

 constructor(public sqlite :SQLite) {
          console.log('Hello DataServiceProvider Provider')

              this.sqlite.create({name: "data.db", location: 
    "default"}).then((db : SQLiteObject) => {
                      this.database = db;
                  }, (error) => {
                      console.log("ERROR: ", error);
              }); 

... to data-service.service.ts Я получил эту ошибку:

core.js: 19866 Ошибка ОШИБКА: необученная (в обещании): Ошибка типа: невозможно чтение свойства then для неопределенного TypeError: Невозможно прочитать свойство «тогда» из неопределенного на новом DataServiceService (data-service.service.ts: 64) в _createClass (core.js: 26976) в createProviderInstance (core.js: 26941) at resolNgModuleDep (core.js: 26888) в NgModuleRef .get (core.js: 27996) at resolNgModuleDep (core.js: 26908) в NgModuleRef_.get (core.js: 27996) at resolDep (core.js: 28518) в createClass (core.js: 28366) в createDirectiveInstance (core.js: 28186) at resolPromise (zone.js: 831) at resolPromise (zone.js: 788) at zone.js: 892 в ZoneDelegate.push ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invokeTask (zone.js: 423) в Object.onInvokeTask (core.js: 21826) в ZoneDelegate.push ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invokeTask (zone.js: 422) в Zone.push ../ node_modules / zone.js / dist / zone.js.Zone.runTask (zone.js: 195) при сливе MicroTaskQueue (zone.js: 601)

Это весь код data-service.service.ts:

import { Injectable } from '@angular/core';

import { SQLite, SQLiteObject } from '@ionic-native/sqlite/ngx';



@Injectable({
  providedIn: 'root'
})
export class DataServiceService {
  public database: SQLiteObject;

  productTable : string = `CREATE TABLE IF NOT EXISTS  products (
    id INTEGER PRIMARY KEY,
    sku TEXT,
    barcode TEXT,
    title TEXT NOT NULL,
    description TEXT,
    quantity REAL,
    unit VARCHAR,
    unitPrice REAL,
    minQuantity INTEGER,
    familly_id INTEGER,
    location_id INTEGER,
    FOREIGN KEY(familly_id) REFERENCES famillies(id),
    FOREIGN KEY(location_id) REFERENCES locations(id)
    );`;

familyTable : string = `CREATE TABLE IF NOT EXISTS famillies (
    id INTEGER PRIMARY KEY,
    reference VARCHAR(32) NOT NULL,
    name TEXT NOT NULL,
    unit VARCHAR);`;

locationTable : string = `CREATE TABLE IF NOT EXISTS locations (
        id INTEGER PRIMARY KEY,
        name TEXT NOT NULL);`;
//Date , Quantity , Unit Cost , Reason (New Stock - Usable Return - Unusable Return ) ,UPC (Universal Product Code ) Comment    
transactionTable : string = `CREATE TABLE IF NOT EXISTS transactions (
        id INTEGER PRIMARY KEY,
        date TEXT,
        quantity REAL,
        unitCost REAL,
        reason VARCHAR,
        upc TEXT,
        comment TEXT,
        product_id INTEGER,
        FOREIGN KEY(product_id) REFERENCES products(id));`;

        async createTables(){
          try {
            await this.database.executeSql(this.familyTable);
            await this.database.executeSql(this.locationTable);
            await this.database.executeSql(this.productTable);
            await this.database.executeSql(this.transactionTable);
          }catch(e){
              console.log("Error !");
          }
      }

        constructor(public sqlite :SQLite) {
          console.log('Hello DataServiceProvider Provider')

              this.sqlite.create({name: "data.db", location: "default"}).then((db : SQLiteObject) => {
                      this.database = db;
                  }, (error) => {
                      console.log("ERROR: ", error);
              }); 
    }

}

У кого-нибудь есть идеи, как это исправить?

Answer 1

Ваш код не будет работать в браузере при запуске ionic serve, потому что:

Согласно упомянутому здесь

Cordova нужны плагины для запуска в браузере

И они не добавляются по умолчанию. Таким образом, вы можете запустить проект с ionic cordova run browser

---

ИЛИ как уже упоминалось в комментарии, смейтесь над плагином. Попробовал и все заработало:

в модуле приложения, макет create:

import { SQLite  , SQLiteDatabaseConfig , SQLiteObject } from '@ionic-native/sqlite';

class SQLiteMock {
public create(config: SQLiteDatabaseConfig): Promise<SQLiteObject> {
    return new Promise((resolve,reject)=>{
      resolve(new SQLiteObject(new Object()));
    });
  }
} 

Отметьте это в поставщиках как:

{provide: SQLite, useClass: SQLiteMock},

Создайте файл sql.js файл в папке и скопируйте содержимое отсюда: https://raw.githubusercontent.com/kripken/sql.js/master/js/sql.js

и добавьте в свой index.html:

<script src="assets/sql.js"></script>
<script src="build/polyfills.js"></script>
<script src="build/main.js"></script>

Теперь ваша функция должна работать нормально. Продолжая дальнейшие действия, я предлагаю вам перейти по ссылке, которую я предоставил перед этим кодом, то есть: https://www.techiediaries.com/mocking-native-sqlite-plugin/

Answer 2

Одна вещь, на которую вы могли бы обратить внимание, - это запуск конструктора перед асинхронной функцией в вашем коде. Если это так, обратите внимание на реализацию чего-то похожего на ngOnInit.