瀏覽器也可以調(diào)試

• 添加sqlite插件

ionic cordova plugin add cordova-sqlite-storage
npm install --save @ionic-native/sqlite

• 新建一個SqlService服務(wù)
  導(dǎo)入sqlite
  import { SQLite } from '@ionic-native/sqlite';
  判斷平臺建DB文件:真機(jī)用sqlite.create,瀏覽器用window.openDatabase

    private _db: any;
    private win: any = window;

    constructor(public http: Http, public sqlite: SQLite) {
        if (this.win.sqlitePlugin) {
            this._db = sqlite.create({
                name: 'appdata.db',
                location: 'default'
            });
        } else {
            this._db = this.win.openDatabase("appdata.db", '1.0', 'database', 5 * 1024 * 1024);
        }
    }

執(zhí)行SQL語句娇斑，返回一個承諾

 execSql(sql: string, params = []): Promise<any> {
        return new Promise((resolve, reject) => {
            try {
                this._db.transaction((tx) => {
                        tx.executeSql(sql, params,
                            (tx, res) => resolve({ tx: tx, res: res }),
                            (tx, err) => reject({ tx: tx, err: err }));
                    },
                    (err) => reject({ err: err }));
            } catch (err) {
                reject({ err: err });
            }
        });
    }

• 使用：在需要使用的頁面ts文件里，導(dǎo)入SqlService文件

建表：

  this.sqlService.execSql(obj.sql).then(() => {
                console.info(obj.desc, '表名:', obj.tableName, '創(chuàng)建成功');
            }).catch(err => {
                console.error("出錯了", err.error.message);
            });

更新：

    let sql = "update depot set depot_name='" + data.depot_name + "' where depot_no='" + item.depot_no + "'";
                this.sqlService.execSql(sql, []).then(() => {
               
                }).catch((err) => {
                    console.error(err);
                });
            }

其他類似

注意查詢的時(shí)候，要轉(zhuǎn)換一下才能得到數(shù)據(jù)

 let output = [];
 let sql = "select * from XXX";
        this.sqlService.execSql(sql, []).then((data) => {
            for (let i = 0; i < data.res.rows.length; i++) {
                output.push(data.res.rows.item(i));
            }
             console.log(output );
        }).catch((err) => {
            console.error(err);
        });

貼出SqlService完整代碼

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

@Injectable()
export class SqlService {
    private _db: any;
    private win: any = window;

    constructor(public http: Http, public sqlite: SQLite) {
        if (this.win.sqlitePlugin) {
            this._db = sqlite.create({
                name: 'appdata.db',
                location: 'default'
            });
        } else {
            this._db = this.win.openDatabase("appdata.db", '1.0', 'database', 5 * 1024 * 1024);
        }
    }

    /**
     * 執(zhí)行SQL語句捏肢，返回一個承諾,通過 .then(result=>{}).catch(err=>{})來處理結(jié)果
     * @param sql  sql語句
     * @param params sql參數(shù)值神得，可選參數(shù)厘惦，只有sql語句中用到 ? 傳參方式時(shí)，params參數(shù)值才有效
     */
    execSql(sql: string, params = []): Promise<any> {
        return new Promise((resolve, reject) => {
            try {
                this._db.transaction((tx) => {
                        tx.executeSql(sql, params,
                            (tx, res) => resolve({ tx: tx, res: res }),
                            (tx, err) => reject({ tx: tx, err: err }));
                    },
                    (err) => reject({ err: err }));
            } catch (err) {
                reject({ err: err });
            }
        });
    }

}