Ionic2调用本地SQlite实例

 更新时间:2017年04月22日 10:58:11   作者:莫干牧童  
这篇文章主要介绍了Ionic2调用本地SQlite实例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

普通的app用ionic内置的Storage存储键值对的方式可以满足日常的使用,但是有时候遇到一些奇怪的需求。比如说有个网友留言说做一个离线版的App,怎样调用本地Sqlite执行SQL语句。问题描述清楚直接上代码。

需要说明的是SQLite是手机内置的数据库存储方式,在Ionic2中需要安装相应的插件和安装包。过程很简单

第一步

安装插件、并加入项目

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

第二步

把服务加入到src/app/app.moudle.ts

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

第三步

使用数据库,常规来说,这一步应该封装成公共服务或者工具类。类中是具体的创建数据库,调用数据库,CRUD等方法。这里只是说明原理,直接调用

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')",{});//插入数据
  })
  .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安装到手机才能得到结果,毕竟是调用手机内置的SQLite。
ionic build android

用上面的命令构建APP并安装到手机看看效果吧

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 分享几个JavaScript运算符的使用技巧

    分享几个JavaScript运算符的使用技巧

    这篇文章主要介绍了分享几个JavaScript运算符的使用技巧,帮助大家更好的理解和学习使用JavaScript,感兴趣的朋友可以了解下
    2021-04-04
  • 解决layer 关闭当前弹窗 关闭遮罩层 input值获取不到的问题

    解决layer 关闭当前弹窗 关闭遮罩层 input值获取不到的问题

    今天小编就为大家分享一篇解决layer 关闭当前弹窗 关闭遮罩层 input值获取不到的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 详解iframe与frame的区别

    详解iframe与frame的区别

    Frame与Iframe两者可以实现的功能基本相同,不过Iframe比Frame具有更多的灵活性,通过本文给大家详解细节iframe与frame的区别,对iframe与frame的区别相关知识感兴趣的朋友一起学习吧
    2016-01-01
  • JavaScript Sort 的一个错误用法示例

    JavaScript Sort 的一个错误用法示例

    这篇文章主要介绍了JavaScript Sort 的一个错误用法示例,本文分析了一个Sort实例得到了这个错误用法并给出了解决方法,需要的朋友可以参考下
    2015-03-03
  • js实现双色球效果

    js实现双色球效果

    这篇文章主要为大家详细介绍了js实现双色球效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • js canvas实现放大镜查看图片功能

    js canvas实现放大镜查看图片功能

    这篇文章主要为大家详细介绍了js canvas实现放大镜查看图片功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-06-06
  • JavaScript 中的数据类型Number

    JavaScript 中的数据类型Number

    这篇文章主要介绍了JavaScript 中的数据类型Number,Number 类型使用 IEEE 754 格式表示整数和浮点值,下文相关详细资料介绍,需要的小伙伴可以参考一下
    2022-04-04
  • Javascript中字符串replace方法的第二个参数探究

    Javascript中字符串replace方法的第二个参数探究

    当我们要把一段字符串中的某些指定字符替换掉,第一时间想到的就是replace方法,他的用法很简单,W3school上讲的清晰易懂。网上有关replace的文章也有很多了,那么这篇这里主要聊聊它的第二个参数,下面来一起看看,注意阅读本文需要对replace方法有一定了解。
    2016-12-12
  • Locate a File Using a File Open Dialog Box

    Locate a File Using a File Open Dialog Box

    Locate a File Using a File Open Dialog Box...
    2007-06-06
  • js+canvas实现纸牌游戏

    js+canvas实现纸牌游戏

    这篇文章主要为大家详细介绍了js+canvas实现纸牌游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-03-03

最新评论