溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

Ionic2調(diào)用本地SQlite實例

發(fā)布時間:2020-10-09 20:11:17 來源:腳本之家 閱讀:186 作者:莫干牧童 欄目:web開發(fā)

普通的app用ionic內(nèi)置的Storage存儲鍵值對的方式可以滿足日常的使用,但是有時候遇到一些奇怪的需求。比如說有個網(wǎng)友留言說做一個離線版的App,怎樣調(diào)用本地Sqlite執(zhí)行SQL語句。問題描述清楚直接上代碼。

需要說明的是SQLite是手機內(nèi)置的數(shù)據(jù)庫存儲方式,在Ionic2中需要安裝相應(yīng)的插件和安裝包。過程很簡單

第一步

安裝插件、并加入項目

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

第二步

把服務(wù)加入到src/app/app.moudle.ts

...
import { SQLite } from '@ionic-native/sqlite';
...
providers: [
 ...
 SQLite
]
...

第三步

使用數(shù)據(jù)庫,常規(guī)來說,這一步應(yīng)該封裝成公共服務(wù)或者工具類。類中是具體的創(chuàng)建數(shù)據(jù)庫,調(diào)用數(shù)據(jù)庫,CRUD等方法。這里只是說明原理,直接調(diào)用

import { Component } from '@angular/core';
import { SQLite, SQLiteObject } from '@ionic-native/sqlite';
@Component({
 selector: 'page-hello-ionic',
 templateUrl: 'hello-ionic.html'
})
export class HelloIonicPage {
 constructor(
       private sqlite: SQLite) {

 }
 database :SQLiteObject;
 ngOnInit(){
  this.initDB();
 }
 initDB(){
  this.sqlite.create({
   name: 'data.db',
   location: 'default'
  })
  .then((db: SQLiteObject) => {
  db.executeSql('create table t_log(name VARCHAR(32))', {})//建表
   .then(() => console.log('Executed SQL'))
   .catch(e => console.log(e));

  this.database = db;
  db.executeSql("insert into t_log values('123')",{});//插入數(shù)據(jù)
  })
  .catch(e => console.log(e));

 }
//查詢
query() {
  let results = this.database.executeSql("select * from t_log",{});
  alert(data.rows.length);
  alert(data.rows.item(0).name);
  })
 }
}

最后一步

這一步一定要生成app安裝到手機才能得到結(jié)果,畢竟是調(diào)用手機內(nèi)置的SQLite。
ionic build android

用上面的命令構(gòu)建APP并安裝到手機看看效果吧

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持億速云。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI