Ionic2 Cordova-SQLite-Storage：如何將SQLite用作服務

Question

我正在嘗試使用Ionic 2中的Cordova插件sqlite作為服務。

項目生成，但運行空白頁。

這是我在android logcat中看到的與此相關的內容：

10-29 02:15:11.082 8010-8010/? I/chromium: [INFO:CONSOLE(5)] "EXCEPTION: No provider for t!", source: file:///android_asset/www/build/main.js (5)
10-29 02:15:11.082 8010-8010/? I/chromium: [INFO:CONSOLE(5)] "ORIGINAL STACKTRACE:", source: file:///android_asset/www/build/main.js (5)
10-29 02:15:11.082 8010-8010/? I/chromium: [INFO:CONSOLE(5)] "Error: DI Error
                                               at e.Error (<anonymous>)
                                               at e (file:///android_asset/www/build/main.js:5:5322)
                                               at e (file:///android_asset/www/build/main.js:5:10802)
                                               at new e (file:///android_asset/www/build/main.js:5:11130)
                                               at t._throwOrNull (file:///android_asset/www/build/main.js:5:28341)
                                               at t._getByKeyDefault (file:///android_asset/www/build/main.js:5:28697)
                                               at t._getByKey (file:///android_asset/www/build/main.js:5:28252)
                                               at t.get (file:///android_asset/www/build/main.js:5:24608)
                                               at e.get (file:///android_asset/www/build/main.js:7:16300)
                                               at e.get (file:///android_asset/www/build/main.js:8:3564)", source: file:///android_asset/www/build/main.js (5)
10-29 02:15:11.092 8010-8010/? I/chromium: [INFO:CONSOLE(5)] "EXCEPTION: No provider for t!", source: file:///android_asset/www/build/main.js (5)
10-29 02:15:11.092 8010-8010/? I/chromium: [INFO:CONSOLE(5)] "ORIGINAL STACKTRACE:", source: file:///android_asset/www/build/main.js (5)
10-29 02:15:11.092 8010-8010/? I/chromium: [INFO:CONSOLE(5)] "Error: DI Error
                                               at e.Error (<anonymous>)
                                               at e (file:///android_asset/www/build/main.js:5:5322)
                                               at e (file:///android_asset/www/build/main.js:5:10802)
                                               at new e (file:///android_asset/www/build/main.js:5:11130)
                                               at t._throwOrNull (file:///android_asset/www/build/main.js:5:28341)
                                               at t._getByKeyDefault (file:///android_asset/www/build/main.js:5:28697)
                                               at t._getByKey (file:///android_asset/www/build/main.js:5:28252)
                                               at t.get (file:///android_asset/www/build/main.js:5:24608)
                                               at e.get (file:///android_asset/www/build/main.js:7:16300)
                                               at e.get (file:///android_asset/www/build/main.js:8:3564)", source: file:///android_asset/www/build/main.js (5)
10-29 02:15:11.102 8010-8010/? I/chromium: [INFO:CONSOLE(3)] "Error: No provider for t!", source: file:///android_asset/www/build/polyfills.js (3)

我的離子文件是這樣的：“ [我的項目] \\ src \\ services \\ sql-settings \\ sql-settings.ts”：

import { Injectable } from '@angular/core';
import { SQLite } from 'ionic-native';

@Injectable()
export class SqlSettingsService {

    constructor(
        public db: SQLite
    ) {     
        this.db = new SQLite();
    }

    openDb(){
        return this.db.openDatabase({
             name: 'data.db',
             location: 'default' // the location field is required
        });
    }

}

“ [我的項目] \\ src \\ app \\ app.module.ts”：

import { NgModule } from '@angular/core'; import { IonicApp, IonicModule } from 'ionic-angular'; import { MyApp } from './app.component'; import { HomePage } from '../pages/home/home'; import { SqlSettingsService } from '../services/sql-settings/sql-settings';



@NgModule({   declarations: [
    MyApp,
    HomePage   ],   imports: [
    IonicModule.forRoot(MyApp)   ],   bootstrap: [IonicApp],   entryComponents: [
    MyApp,
    HomePage   ],   providers: [SqlSettingsService] }) export class AppModule {}

最后“ [我的項目] \\ src \\ app \\ app.component.ts”：

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar, Splashscreen } from 'ionic-native';

import { HomePage } from '../pages/home/home';


import { SqlSettingsService } from '../services/sql-settings/sql-settings';


@Component({
  template: `<ion-nav [root]="rootPage"></ion-nav>`,
  providers: [SqlSettingsService]
})
export class MyApp {
  rootPage = HomePage;

  constructor(platform: Platform, sqlSettingsService: SqlSettingsService) {


    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();
      Splashscreen.hide();

      sqlSettingsService.openDb().then(
        ()=>{alert("OPEN DB IS SUCCESSFUL")},
        (err)=>{alert('Unable to open database: ' + err)}
      );


    });
  }
}

Answer 1

你為什么做這個？

constructor(public db: SQLite) {     
   this.db = new SQLite();
}

這是沒有意義的。 1.沒有提供者，因此無法注入。 2.即使已注入，您仍要為其分配新的內容。 無意義。 您可能想做的是

db: SQLite;

constructor() {
  this.bd = new SQLite();
}

Answer 2

沒有必要

public db: SQLite
) {     
    this.db = new SQLite();
}

只需在app.module.ts文件中使用它

import { SqlSettingsService } from '../services/sql-settings/sql-settings';

並在提供程序中使用SqlSettingsService