1.localStorage存储服务:

.factory('storageSvc', [function () {
return {
//保存数据
save: function (key, value) {
window.localStorage.setItem(key, value);
},
//读取数据
load: function (key) {
return window.localStorage.getItem(key);
},
//删除单个数据
delete: function (key) {
window.localStorage.removeItem(key);
},
//删除所有数据
deleteAll: function () {
window.localStorage.clear();
},
//得到某个索引的key
getIndexKey: function (index) {
window.localStorage.key(index);
}
}
}]);

 2.localStorage 存储方案

localstoage保存的数据,是以key / value的形式存储的。value是一个字符串,因此如果要保存多个数据,有以下处理方式:
一. 使用多个key/value组合,每一个输入框的key都不一样,这样相互之间就不会有影响,就可以保存和获取多个值.
二.将一系列输入框内容保存在同一个key下面,那么对value的形式就需要做一些特殊的处理,一般来说分为两种处理方式:
1. 使用分隔符,例如 value1|value2|value3,使用竖线分割,读取出来后再使用竖线拆分。这种方式优点是是简单,缺点是对保存的顺序有要求。你必须知道第一个是代表什么,第二个是代表什么。
2. 使用序列化的对象,例如要将一些值存到一个对象,再将对象转换为字符串存到localstorage,就像这样:"{key1: 'value1', key2: 'value2'}"。然后读取数据的时候,将字符串再转成对象。这样做的优点是结构清晰,维护方便;缺点是相对麻烦点,且效率相对第1种要低,因为毕竟要做一些序列化和反序列化的操作。

3.在将对象保存为JSON格式前,需要将对象序列化为JSON字符串以及将JSON字符串反序列化为对象。

参考文章:

1.Html5利用json存储复杂数据:

2.Quick tip: using HTML5 localstorage to store JSON objects on a device in your PhoneGap app

3.HTML5本地存储之Web Storage篇

6.Creating a CRUD form with HTML5 Local Storage and JSON

 

8.Key-Value Storage

9.Storing Objects in HTML5 localStorage

10.DOM Storage guide

11.Js 基于html5-localStorage方法 制作的 "我的便签本"

12.使用 jQuery Mobile 与 HTML5 开发 Web App —— HTML5 Web Storage

13.CRUD operations with local storage as a database

 

LocalStorage存储的更多相关文章

  1. 使用sessionStorage、localStorage存储数组与对象(转)

    http://my.oschina.net/crazymus/blog/371757 使用sessionStorage.localStorage存储数组与对象 发表于3个月前(2015-01-26 1 ...

  2. AngularJS进阶(二十九)AngularJS项目开发技巧之localStorage存储

    AngularJS项目开发技巧之localStorage存储       注: localStorage深度学习 绪 项目开发完毕,测试阶段发现后台管理端二维码生成有问题,问题在于localStora ...

  3. 使用sessionStorage、localStorage存储数组与对象

    先介绍一下localStorage localStorage对象是HTML5的客户端存储持久化数据的方案.为了能访问到同一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一 ...

  4. localStorage存储对象,sessionStorage存储数组对象

    前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听,数据只要发生变化就能很方便的自动渲染页面.但随即出现的问题是,之前用户操作的样式都会被重置掉. 例如我勾选了几个 ...

  5. localStorage存储数组,对象,localStorage,sessionStorage存储数组对象

    localStorage存储数组,对象,localStorage,sessionStorage存储数组对象   前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听, ...

  6. LocalStorage存储JSON对象的问题

    LocalStorage存储JSON对象的问题   localStorage - 没有时间限制的数据存储 1 var arr=[1,2,3]; 2 localStorage.setItem(" ...

  7. localstorage存储对象

    之前在客户端存储数据一直用的是cookie,由于有大小等限制,随着html5时代的到来,现在大多数用的是localstorage存储数据: 例如: localStorage.setItem(" ...

  8. HTML5 WEB Storage - localStorage存储位置在哪

    localStorage作为客户端浏览器持久化存储方案 这个是浏览器隔离的,每个浏览器都会把localStorage存储在自己的UserData中,如chrome一般就是 C:\Users\你的计算机 ...

  9. Android WebView js混合cookie和localStorage存储

    一.cookie存储和取出: (1)存储: ------------------- **在loadURL之前调用** -------------------- /** * 同步一下cookie */ ...

随机推荐

  1. C#/winform 旅游管理信息系统

    工具:Visual Studio 2015,sql server2014 1.系统概述 该旅游管理信息系统可以为游客和公司业务管理员提供服务.游客可以对旅游路线,旅游班次,旅游团,保险,导游,交通工具 ...

  2. 【巧妙】【3-21个人赛】Problem C 01串

    Problem C Time Limit : 3000/1000ms (Java/Other)   Memory Limit : 65535/32768K (Java/Other) Total Sub ...

  3. SQL Server插入中文数据后出现乱码

    今天在做项目的过程中遇到如标题的问题,情况如下图: 数据库使用的是SQL Server2012版本,创建表的脚本如下: CREATE TABLE [dbo].[Type](  [TypeId] INT ...

  4. Win手机安卓程序初体验

    老大说快看博客园,Windows手机可以装安卓程序了. 啊,真的么?可以在我的撸妹1520上愉快的玩COC了么?我还可以愉快的看小说,不对,是听小说,哈哈,安卓君的三千万程序兵,等着老夫来一一临幸你们 ...

  5. Sql Server数据库设计高级查询

    -------------------------------------第一章  数据库的设计------------------------------------- 软件开发周期:     (1 ...

  6. _cdel stdcall

    __cdecl 是C Declaration的缩写(declaration,声明),表示C语言默认的函数调用方法:所有参数从右到左依次入栈,这些参数由调用者清除,称为手动清栈.被调用函数不会要求调用者 ...

  7. VC++客户端 缩小包的尺寸

    图片压缩: 1. 背景图片尺寸一般为100-300KB,使用纯色图片可缩小至1-3KB,方法得当可缩小1M多: 2. .ico一般为100-200KB,16x16一直到256x256,可减去其中几种尺 ...

  8. PARTITION(number theory) ALSO Explosive number in codewars

    问题出于codewars,简言之:寻找和为一个整数的的不同整数组合.https://en.wikipedia.org/wiki/Partition_(number_theory) 例如:和为6的整数组 ...

  9. oracle体系结构

    oracle体系结构有四个部分组成分别为:oracle 服务器.用户进程.服务器进程.其他关键文件.其中oracle服务器又有实例(instance)和database组成是一个数据库管理系统. 一. ...

  10. 图片与文字在div里实现垂直水平都居中

    第一种方法,利用盒布局实现   <style type="text/css">/*盒布局实现图片与文字水平垂直居中*/ .div1{ width: 100%; heig ...