作者:Grey

原文地址: http://www.cnblogs.com/greyzeng/p/5557947.html

 
 

     
 

 Ionic2可以有两种方式来存储数据,Local Storage和SQLite

 
 

LocalStorage

 
 

因为比较容易访问,所以不适合存比较敏感性的数据

比如可以存储: 用户是否登录的信息. 一些session信息等

具体用法:

  • 进入项目目录:cd MyFirstApp
  • 在主页设置一个按钮,点击按钮,获取LocalStorage的数据并打印在控制台

    app/pages/home/home.html

    在app/pages/home/home.ts中增加一个处理方法:

    我们可以通过

    this.local = new Storage(LocalStorage);

    this.local.set('isLogin', false);

    来设置并保存isLogin的值

    并且通过:

    this.local.get('isLogin');

    来获取isLogin的值

  • 运行:ionic serve -l

    点击按钮,打开Chrome控制台,可以看到输出结果:

     
     

SQLite

我们还可以通过SQLite来存储数据,通过SQL语句来实现相关存储。

  • 首先我们必须增加一个插件:进入项目目录:cd MyFirstApp

    运行:ionic plugin add https://github.com/litehelpers/Cordova-sqlite-storage

  • 在app/app.ts中,我们先初始化一些数据库信息:

  • 在app/pages/home/home.html中增加一个按钮和一个Label,点击按钮,将数据库dbname6中people这个表的第一条记录的firstname字段展示出来:

    app/pages/home/home.html

    在app/pages/home/home.ts中增加相应的方法来获取数据库中的数据:

  • 运行:ionic serve -l

    点击ShowData按钮:

     
     

更多:Use SQLite In Ionic 2 Instead Of Local Storage

------

上一篇:Ionic2学习笔记(7):Input

下一篇:Ionic2学习笔记(9):访问本地设备

Ionic2学习笔记(8):Local Storage& SQLite的更多相关文章

  1. Ionic2学习笔记(9):访问本地设备

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5559927.html               Ionic2提供了访问本地设备的方法,但是需要安装 ...

  2. Ionic2学习笔记(7):Input

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5554610.html           我们先来看一个简单的输入用户名和密码点击登录的界面:   ...

  3. Ionic2学习笔记(10):扫描二维码

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5575843.html 时间:6/11/2016     说明: 在本文发表的时候(2016-06-1 ...

  4. Ionic2学习笔记(6):Navigation

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5551535.html           Ionic2中创建一个页面很方便,在页面之间相互切换也很方 ...

  5. Ionic2学习笔记(5):Provider

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5547646.html             Provider是一种为App提供数据源的方式, 举个 ...

  6. Ionic2学习笔记(0):HelloWorld

    作者:Grey 原文地址:http://www.cnblogs.com/greyzeng/p/5529153.html 操作系统: Windows 10 环境配置: Node.js Java SE D ...

  7. Ionic2学习笔记(4):*号

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5544479.html                     大家常常会在ionic2页面中见到*号 ...

  8. Ionic2学习笔记(3):Pipe

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5538630.html Pipe类似过滤器,比如,在一个字符串要展现在页面之前, 我们需要对这个字符串 ...

  9. Ionic2学习笔记(2):自定义Component

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5536298.html                     上一篇提到,Ionic2提供了很多Co ...

随机推荐

  1. MVC Castle依赖注入实现代码

    1.MVc 实现依赖注入 public class WindsorControllerFactory : DefaultControllerFactory { private readonly IKe ...

  2. 通过jquery js 实现幻灯片切换轮播效果

    观察各个电商网址轮播图的效果,总结了一下主要突破点与难点 1.->封装函数的步骤与具体实现 2->this关键字的指向 3->jquery js函数熟练运用 如animate 4-& ...

  3. dev GridControl 根据鼠标坐标 选中行

    if (e.Button == System.Windows.Forms.MouseButtons.Right) { DevExpress.XtraGrid.Views.Grid.ViewInfo.G ...

  4. Redis 数据类型及其特点

    Redis支持五种数据类型:string(字符串),hash(哈希),list(列表),set(集合)及zset(sorted set:有序集合). String(字符串) string是redis最 ...

  5. 学习笔记: Delphi之线程类TThread

    新的公司接手的第一份工作就是一个多线程计算的小系统.也幸亏最近对线程有了一些学习,这次一接手就起到了作用.但是在实际的开发过程中还是发现了许多的问题,比如挂起与终止的概念都没有弄明白,导致浪费许多的时 ...

  6. Visual Studio 2015 CTP6 发布

    微软发布ASP.NET 5 支持在Windows.Mac和Linux上构建程序,Visual Studio 2015 CTP6(社区预览版)现已发布了.感兴趣的朋友们可以登录官网下载[http://w ...

  7. AngularJS 中的Promise --- $q服务详解

    先说说什么是Promise,什么是$q吧.Promise是一种异步处理模式,有很多的实现方式,比如著名的Kris Kwal's Q还有JQuery的Deffered. 什么是Promise 以前了解过 ...

  8. static与并发

    在java中static用来修饰Class类中属性和方法. 被static修饰的成员属性和成员方法独立于该类的任何对象,它们在内存空间上会被放在描述Class的位置中,也就是说它们为此类(Class) ...

  9. Self Host模式下的ASP. NET Web API是如何进行请求的监听与处理的?

    构成ASP.NET Web API核心框架的消息处理管道既不关心请求消息来源于何处,也不需要考虑响应消息归于何方.当我们采用Web Host模式将一个ASP.NET应用作为目标Web API的宿主时, ...

  10. 调试的时候 line not available!

    手贱, 不小心修改了一个地方,后面调试代码的时候,总感觉不对.出现: line not available, 总是到不了源码里面,反复部署了N次还是一样, 非常郁闷,... 搞了一两个小时后,后面醒悟 ...