ionic 2 Error 'ReferenceError: sqlitePlugin не определен'

Question

Я использую ионный 2 native sqlite plugin, чтобы создать базовое приложение для захвата и хранения изображений на локальном хранилище телефонов. Я всегда получаю ошибку uncaught exception (похоже, из плагина sql) иногда, когда я запускаю приложение в эмуляторе genymotion.

Обычно это происходит, когда приложение перезагружается, когда я использую параметр -live (ионный запуск android -c -l). Я также заметил, что данные, хранящиеся в приложении, не отображаются (это снова указывает на то, что есть некоторая проблема с загрузкой сохраненных данных при «живой перезагрузке») Я поставил ошибку, которую я получил на консоли ниже:

Консоль сообщение об ошибке

[13:28:27] Starting 'html'... 
[13:28:27] Finished 'html' after 42 ms 
HTML changed: www/build/pages/home/home.html 
HTML changed: www/build/pages/map-detail-component/map-detail-component.html 
HTML changed: www/build/pages/map-page/map-page.html 
0  298305 log  Angular 2 is running in the development mode. Call enableProdMode() to enable the production mode. 
1  298474 group EXCEPTION: Error: Uncaught (in promise): ReferenceError: sqlitePlugin is not defined 
2  298475 error EXCEPTION: Error: Uncaught (in promise): ReferenceError: sqlitePlugin is not defined 
3  298476 error STACKTRACE: 
4  298477 error Error: Uncaught (in promise): ReferenceError: sqlitePlugin is not defined 
    at resolvePromise (http://192.168.56.1:8100/build/js/zone.js:418:31) 
    at resolvePromise (http://192.168.56.1:8100/build/js/zone.js:403:17) 
    at http://192.168.56.1:8100/build/js/zone.js:451:17 
    at ZoneDelegate.invokeTask (http://192.168.56.1:8100/build/js/zone.js:225:37) 
    at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (http://192.168.56.1:8100/build/js/app.bundle.js:37360:41) 
    at ZoneDelegate.invokeTask (http://192.168.56.1:8100/build/js/zone.js:224:42) 
    at Zone.runTask (http://192.168.56.1:8100/build/js/zone.js:125:47) 
    at drainMicroTaskQueue (http://192.168.56.1:8100/build/js/zone.js:357:35) 
    at XMLHttpRequest.ZoneTask.invoke (http://192.168.56.1:8100/build/js/zone.js:297:25) 
5  298478 groupEnd 
6  298481 error Unhandled Promise rejection:, sqlitePlugin is not defined, ; Zone:, angular, ; Task:, Promise.then, ; Value:, [object Object], ReferenceError: sqlitePlugin is not defined 
    at http://192.168.56.1:8100/build/js/app.bundle.js:97420:13 
    at new ZoneAwarePromise (http://192.168.56.1:8100/build/js/zone.js:467:29) 
    at SQLite.openDatabase (http://192.168.56.1:8100/build/js/app.bundle.js:97419:16) 
    at new SqlService (http://192.168.56.1:8100/build/js/app.bundle.js:218:21) 
    at DebugAppView.Object.defineProperty.get (MyApp.template.js:18:67) 
    at DebugAppView._View_MyApp_Host0.injectorGetInternal (MyApp.template.js:35:79) 
    at DebugAppView.AppView.injectorGet (http://192.168.56.1:8100/build/js/app.bundle.js:31753:21) 
    at DebugAppView.injectorGet (http://192.168.56.1:8100/build/js/app.bundle.js:31945:49) 
    at ElementInjector.get (http://192.168.56.1:8100/build/js/app.bundle.js:31246:33) 
    at ElementInjector.get (http://192.168.56.1:8100/build/js/app.bundle.js:31249:48) 
7  298519 log  DEVICE READY FIRED AFTER, 1004, ms 
8  298609 log  Entering: map-page 
9  298620 log  ERROR: , {} 

Это уходит, когда я перезапустить эмулятор, но потом иногда появляется снова после более использования.

Я думал, что это может быть связано с созданием SQLite db перед импортированием плагина, но я импортировал плагин в свой файл root app.ts (показано ниже) (все приложение можно увидеть в этом github repo)

Корневые app.ts

@Component({ 
    template: '<ion-nav [root]="rootPage"></ion-nav>', 
    // Declare services 
    providers: [ SqlService ] 
}) 
export class MyApp { 
    rootPage: any = MapPage; 

    constructor(platform: Platform) { 
     platform.ready().then(() => { 
      StatusBar.styleDefault(); 
     }); 
    } 
}  
ionicBootstrap(MyApp); 

Я приурочены любое использование плагина к sqlService (как показано ниже)

SQL Service

import { Injectable } from '@angular/core'; 
import 'rxjs/add/operator/map'; 
import { SQLite} from 'ionic-native'; 

@Injectable() 
export class SqlService { 
    private db: SQLite; 
    private isOpen: boolean; 

    public constructor() { 
    if(!this.isOpen){ 
     this.db = new SQLite(); 
     this.db.openDatabase({ 
     name: "data.db", 
     location: "default" 
     }).then(() => { 
     this.db.executeSql("CREATE TABLE IF NOT EXISTS places (id INTEGER PRIMARY KEY AUTOINCREMENT, title TEXT, img TEXT)", []).then((data) => { 
      console.log("TABLE CREATED: " + data); 
     }, (error) => { 
      console.log("Unable to execute SQL" + error); 
     }); 
     this.isOpen=true; 
     }); 
    } 
    } 

    public add(title: string, base64Img: string) { 
    return new Promise((resolve, reject) => { 
     this.db.executeSql("INSERT INTO places (title, img) VALUES ('"+ title +"', '"+ base64Img +"')", []) 
     .then((data) => { 
      resolve(data); 
     }, (error) => { 
      reject(error); 
     }); 
    }); 
    } 

    // Remove individual Location 
    public remove(id: number){ 
    return new Promise((resolve, reject) => { 
     this.db.executeSql("DELETE FROM places WHERE id = "+ id +";", []) 
     .then((data) => { 
      resolve(data); 
     }, (error) => { 
      reject(error); 
     }); 
    }); 
    } 

    public locDetail(id: number){ 
    return new Promise((resolve, reject) => { 
     this.db.executeSql("SELECT * FROM places WHERE id = "+ id +";",[]) 
     .then((data) => { 
      if(data.rows.length===1){ 
      // console.log("ttitle: " + data.rows.item(0).title + " id: " + data.rows.item(0).id + " img: " + data.rows.item(0).img); 
      let place = []; 
      place.push({ 
       id: data.rows.item(0).id, 
       title: data.rows.item(0).title, 
       img: data.rows.item(0).img 
      }); 
      resolve(place); 
      } 
     }, (error) => { 
      reject(error); 
     }); 
    }); 
    } 

    // Refresh and initialise the places object 
    public refresh() { 
    return new Promise((resolve, reject) => { 
     this.db.executeSql("SELECT * FROM places", []).then((data) => { 
      let place = []; 
      if (data.rows.length > 0) { 
      for (var i = 0; i < data.rows.length; i++) { 
       place.push({ 
       id: data.rows.item(i).id, 
       title: data.rows.item(i).title, 
       img: data.rows.item(i).img 
       }); 
      } 
      } 
      resolve(place); 
     }, (error) => { 
      reject(error); 
     }); 
     } 
    ); 
    } 
} 

Answer 1

У меня недавно была такая же проблема, убедитесь, что вы проверяете, готова ли платформа к вашим услугам. Импортируйте «платформу» из «ионно-углового» и выполните свой код взаимодействия sqlite в методе prom.then.

Answer 2

Я использую IOS и получаю ту же ошибку 'ReferenceError: sqlitePlugin is not defined'.

Так как sqlite не работает при тестировании в браузере Chrome, я попробовал функцию CLI ionic upload. Затем получил ту же ошибку.

Я наткнулся на this issue на Github.

После использования setTimeout он работает в вид приложения Ионные на IOS:

 setTimeout(function() { 
      let db = new SQLite(); 
      db.openDatabase({ 
       name: "data.db", 
       location: "default" 
      }).then(() => { 
       db.executeSql("CREATE TABLE IF NOT EXISTS people (id INTEGER PRIMARY KEY AUTOINCREMENT, firstname TEXT, lastname TEXT)", {}).then((data) => { 
        console.log("TABLE CREATED: ", data); 
        self.dummy = data 
       }, (error) => { 
        console.error("Unable to execute sql", error); 
        self.dummy = error; 
       }) 
      }, (error) => { 
       console.error("Unable to open database", error); 
       self.dummy = error; 
      }); 
     }, 2000); 

Answer 3

запустите ваш projeect в эмуляторе/симуляторе или андроид устройства/ИОС device.it не работает в браузере.