SQLiteObject未定義在離子3

Question

我正在使用離子本機SQLite數據庫的離子應用程序和在瀏覽器中測試我使用WebSQL。 它在瀏覽器中工作正常，但在Android設備上運行應用程序時。它給我錯誤像Cannot read property 'transaction' of undefined。 以下是供參考的代碼。

1）DBProvider.ts

import { Platform } from 'ionic-angular'; 
import { Injectable } from '@angular/core'; 
import { SQLite, SQLiteObject } from '@ionic-native/sqlite'; 

declare var window: any; 
@Injectable() 
export class DBProvider { 
    DB_NAME: string = 'DailySheet.db'; 
    public websql = null; 
    public sqlite: SQLite; 
    sqliteobj: any; 
    public AppUsers = []; 

    constructor(public platform: Platform) { 
     if (this.platform.is('core')) { 
      this.websql = window.openDatabase(this.DB_NAME, "1.0", "Test DB", 2 * 1024 * 1024); 
      console.log('Database opened.'); 
      this.createTable(); 
     } 

     this.platform.ready().then(() => { 
      if (!this.platform.is('core')) { 
       this.sqlite.create({ name: this.DB_NAME, location: 'default' }) 
        .then((db: SQLiteObject) => { 
         console.log('Database opened.'); 
         this.sqliteobj = db; 
         this.createTable(); 
        }); 
      } 
     }); 
    } 

    createTable() { 
     this.query(`CREATE TABLE IF NOT EXISTS AppUser (
         UserId INTEGER NOT NULL, 
         MobileNo TEXT NOT NULL UNIQUE, 
         Email TEXT, 
         PRIMARY KEY(UserId) 
        )`) 
      .then(data => { 
       console.log('Table created.'); 
      }) 
      .catch(err => { 
       console.error('Unable to create initial storage tables', err.tx, err.err); 
      }); 
    } 

    getAppUsers(): Promise<any> { 
     let query = 'SELECT * FROM AppUser'; 
     return this.query(query) 
      .then(data => { 
       if (data.res.rows.length > 0) { 
        console.log('Rows found.'); 
        return data.res.rows; 
       } 
       else { 
        console.log('No rows found.'); 
       } 
      }); 
    } 

    insertAppUser(): Promise<any> { 
     let id = 1; 
     let mobileno = '8905606191'; 
     let email = 'niravparsana94@gmail.com'; 

     return this.query('INSERT INTO AppUser (UserId, MobileNo, Email) VALUES (' + id + ' ,\"' + mobileno + '\" ,\"' + email + '\")') 
      .then(data => { 
       console.log('Insert success.'); 
       return data; 
      }) 
      .catch(err => { 
       console.error('Unable to insert', err.tx, err.err); 
      }); 
    } 

    updateAppUser(UserId): Promise<any> { 
     let query = "UPDATE Todo SET Email=? WHERE UserId=?"; 
     return this.query(query, ['niravparsana@outlook.com', UserId]) 
      .then(data => { 
       console.log('AppUser Updated.'); 
       return data; 
      }) 
      .catch(err => { 
       console.error('Unable to update', err.tx, err.err); 
      }); 
    } 

    deleteAppUser(UserId): Promise<any> { 
     let query = "DELETE FROM AppUser WHERE UserId=?"; 
     return this.query(query, [UserId]) 
      .then(data => { 
       return data; 
      }) 
      .catch(err => { 
       console.error('Unable to delete', err.tx, err.err); 
      }); 
    } 

    query(query: string, params: any[] = []): Promise<any> { 
     return new Promise((resolve, reject) => { 
      try { 
       if (this.platform.is('core')) { 
        this.websql.transaction((tx: any) => { 
         tx.executeSql(query, params, 
          (tx: any, res: any) => resolve({ tx: tx, res: res }), 
          (tx: any, err: any) => reject({ tx: tx, err: err })); 
        }, 
         (err: any) => reject({ err: err })); 
       } 
       else { 
        this.sqliteobj.transaction((tx: any) => { 
         tx.executeSql(query, params, 
          (tx: any, res: any) => resolve({ tx: tx, res: res }), 
          (tx: any, err: any) => reject({ tx: tx, err: err })); 
        }, 
         (err: any) => reject({ err: err })); 
       } 
      } catch (err) { 
       reject({ err: err }); 
      } 
     }); 
    } 
} 

2）home.ts

import { Component, OnInit } from '@angular/core'; 
import { NavController, Platform } from 'ionic-angular'; 
import { DBProvider } from '../../providers/DBProvider'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage implements OnInit { 
    AppUsers: Array<Object>; 

    constructor(public navCtrl: NavController, private platform: Platform, public db: DBProvider) { 
    } 

    ionViewDidLoad() { 
    this.deleteAppUser(); 
    this.insertAppUser(); 
    this.getAllAppUsers(); 
    } 

    ngOnInit() { 
    } 

    public deleteAppUser() { 
    this.db.deleteAppUser(1) 
     .then(data => { 
     if (data.res.rowsAffected == 1) { 
      console.log('AppUser Deleted.'); 
     } 
     else { 
      console.log('No AppUser Deleted.'); 
     } 
     }) 
     .catch(ex => { 
     console.log(ex); 
     }); 
    } 

    public insertAppUser() { 
    this.db.insertAppUser() 
     .then(data => { 
     }) 
     .catch(ex => { 
     console.log(ex); 
     }); 
    } 

    public getAllAppUsers() { 
    this.db.getAppUsers() 
     .then(data => { 
     this.AppUsers = data; 
     }) 
     .catch(ex => { 
     console.log(ex); 
     }); 
    } 

} 

調試時，我在瀏覽器和移動想出在差序列有所該代碼運行。

在瀏覽器

1. DBProvider構造
2. this.CreateTable（）函數（DBProvider.ts）
3. this.deleteAppUser（）函數（home.ts）
4. this.insertAppUser（）函數（home.ts）
5. this.getAllAppUsers（）函數（home.ts）

在Android裝置

1. DBProvider構造
2. this.deleteAppUser（）函數（home.ts）
3. this.insertAppUser（）函數（home.ts）
4. this.getAllAppUsers（）函數（ home.ts）
5. this.CreateTable（）函數（DBProvider.ts）

正如你可以this.sqliteobj被分配在DBProvider構造。但調試時，我發現來自home.ts的函數在調用sqliteobj之前調用，這就是爲什麼它給出了一個錯誤，如Cannot read property 'transaction' of undefined。但接下來的問題是爲什麼在這個sqliteobj被賦值之前，home.ts函數會被調用？

Answer 1

據我所知，在sqlite數據庫的每次調用中都需要this.sqlite.create(...。所以你必須在sqliteobj之前將它包含在你的查詢函數中。