我一直在使用离子2
native sqlite plugin制作一个基本的应用程序,以捕获图像并将图像存储到手机本地存储.当我在genymotion模拟器上运行应用程序时,我不断收到未捕获的异常错误(似乎来自sql插件).
当我使用-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数据库,但我已经在我的根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服务
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 +";",(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);
});
}
);
}
}
