Блог

Я собираюсь создать приложение для управления запасами Ionic со сканером штрих-кода и 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);
              }); 
  

…для data-service.service.ts я получил эту ошибку:

ошибка core.js: 19866 ОШИБКА Ошибка: не обнаружена (в обещании): TypeError: не удается прочитать свойство ‘then’ неопределенного TypeError: не удается прочитать свойство ‘then’ неопределенного при новом DataServiceService (data-service.service.ts: 64) при _createClass (core.js: 26976) при createProviderInstance (core.js: 26941) в resolveNgModuleDep (core.js: 26888) в NgModuleRef.get (core.js: 27996) в resolveNgModuleDep (core.js: 26908) в NgModuleRef_.get (core.js: 27996) в resolveDep (core.js: 28518) в createClass (core.js: 28366) в createDirectiveInstance (core.js: 28186) в Разрешить проблему (zone.js: 831) в разрешении проблемы (zone.js: 788) в 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) в drainMicroTaskQueue (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);
              }); 
    }

}
  

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

Ваш код не будет работать в браузере при запуске 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},
  

Создайте в папке file 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 /

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