作者: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. 如何在arcmap中调试addin或者插件

    1. 首先,在arcmap中,依次点击“自定义”->"加载项管理器",加载dll或者tlb文件 2. 其次,在vs中,依次点击“工具”->“附加到进程",在对 ...

  2. win 8 换 win7 注意事项

    win8 换win7 硬盘格式修改一下gpt 格式转换为mbr模式 当进入到要选择安装到某一个盘时,由于磁盘的类型不同,会提示:“选中的磁盘采用GPT分区形式无法安装系统”.这时需要重新设置分区形式( ...

  3. C#_闭包陷阱

    如果匿名方法(Lambda表达式)引用了某个局部变量,编译器就会自动将该引用提升到该闭包对象中. 即将for循环中的变量i修改成了引用闭包对象的公共变量i.这样一来,即使代码执行后离开了原局部变量i的 ...

  4. 安卓动态调试七种武器之孔雀翎 – Ida Pro

    安卓动态调试七种武器之孔雀翎 – Ida Pro 作者:蒸米@阿里聚安全 0x00 序 随着移动安全越来越火,各种调试工具也都层出不穷,但因为环境和需求的不同,并没有工具是万能的.另外工具是死的,人是 ...

  5. 《Entity Framework 6 Recipes》中文翻译系列 (18) -----第三章 查询之结果集扁平化和多属性分组

    翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 3-14  结果集扁平化 问题 你有一对多关联的两个实体,你想通过一个查询,获取关联 ...

  6. SpringMVC执行流程

    Spring mvc是一个机遇DispacterServlet的MVC框架,每一个请求都是通过DispacterServlet派发的,具体流程如下: 1.web容器加载后,用户向服务器发送请求,前端控 ...

  7. ng2048源码阅读

    ng2048源码阅读 Tutorial: http://www.ng-newsletter.com/posts/building-2048-in-angularjs.html Github: http ...

  8. SEO的Content里面的内容被转义的解决方法

    看图,不说话 转义的根源 收工 可能不全面,不过确实解决了这个问题,有更好的方法可以提一下,逆天感激不尽

  9. Unity导出的Xcode工程目录

    Classes文件夹: Unity Runtime和ObjectC代码 main.mm和AppController.mm:应用程序入口点 iPhone_Profiler.h:定义了启用内部分析器(In ...

  10. MyEclipse 2014跟2015破解

    最近一直在弄后台开发,之前用idea感觉用的很不习惯,于是就换了myeclipse,两年多没有用myeclipse了,版本都很高了,记得我们之前用myeclipse8.5版本的时候,注册码什么的直接运 ...