angular中的cookie读写方法


Posted in Javascript onAugust 02, 2017

AngularJS中对cookie的操作封装了一个单独的模块,模块名为ngCookies,若想使用需在页面中先引入angular-cookies.js:

<script src="js/angular.min.js"></script>
<script src="js/angular-cookies.js"></script>

然后??gCookies模块注入到我们自定义的模块的依赖模块中:

var app = angular.module("myApp",['ngCookies']);

ngCookies模块中有两个cookies读写相关的服务:$cookies和$cookieStroe。无论使用哪种都要先将其注入到控制器中,为了比较二者的区别,都将其注入到控制器中:

app.controller('namesCtrl', ['$cookies','$cookieStore',function($cookies, $cookieStore){}]);

设置cookie用put()方法:

$cookies.put(key, value[, options]);
$cookieStore.put(key, value);

例如设置一个cookie,名为“userName”,值为“yangmin”:

//使用$cookies设置cookie
$cookies.put('userName', 'yangmin');
//使用$cookieStore设置cookie
$cookieStore.put('userName','yangmin');

获取cookie用get()方法:

$cookies.get(key);
$cookieStore.get(key);

例如获取上面设置的“userName”:

$cookies.get(userName);//yangmin
$cookieStore.get("userName"); //yangmin

删除cookie用remove():

$cookies.remove(key[, options]);
$cookieStore.remove(key);

例如删除“userName”

$cookies.remove("userName");
$cookieStore.remove("userName");

$cookies和$cookieStore的区别:

1.$cookies设置的cookie值一般为字符串,$cookieStroe可用于设置字符串、对象、数组等。

$cookies.put("person",{name:"Amy",age:23});
var person = $cookies.get("person");
console.log(person.age);//undefined
$cookieStore.put("person",{name:"Amy",age:23});
var person = $cookieStore.get("person");
console.log(person.age);//23

2.$cookies可设置参数,例如可设置cookie的过期时间。$cookieStore无法设置参数

var expireDate = new Date();
expireDate.setDate(expireDate.getDate() + 1);
$cookies.put("userName",“yangmin”,{'expires': expireDate});//“userName”一天后过期

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

Javascript 相关文章推荐
获取HTML DOM节点元素的方法的总结
Aug 21 Javascript
JavaScript 存在陷阱 删除某一区域所有节点
May 10 Javascript
Extjs中ComboBox加载并赋初值的实现方法
Mar 22 Javascript
JavaScript实现维吉尼亚(Vigenere)密码算法实例
Nov 22 Javascript
Jquery中children与find之间的区别详细解析
Nov 29 Javascript
jquery实现背景墙聚光灯效果示例分享
Mar 02 Javascript
JS实现自动变换的菜单效果代码
Sep 09 Javascript
跟我学习javascript的全局变量
Nov 16 Javascript
js下将金额数字每三位一逗号分隔
Feb 19 Javascript
jQuery EasyUI基础教程之EasyUI常用组件(推荐)
Jul 15 Javascript
Vue引用Swiper4插件无法重写分页器样式的解决方法
Sep 27 Javascript
vue 解决uglifyjs-webpack-plugin打包出现报错的问题
Aug 04 Javascript
webpack进阶——缓存与独立打包的用法
Aug 02 #Javascript
使用vue构建移动应用实战代码
Aug 02 #Javascript
React Native之ListView实现九宫格效果的示例
Aug 02 #Javascript
jQuery初级教程之网站品牌列表效果
Aug 02 #jQuery
ReactNative列表ListView的用法
Aug 02 #Javascript
ReactNative页面跳转Navigator实现的示例代码
Aug 02 #Javascript
利用JavaScript实现栈的数据结构示例代码
Aug 02 #Javascript
You might like
1.PHP简介
2006/10/09 PHP
PHP备份/还原MySQL数据库的代码
2011/01/06 PHP
php中检查文件或目录是否存在的代码小结
2012/10/22 PHP
php对图像的各种处理函数代码小结
2013/07/08 PHP
php apache开启跨域模式过程详解
2019/07/08 PHP
php+websocket 实现的聊天室功能详解
2020/05/27 PHP
asp.net HttpHandler实现图片防盗链
2009/11/09 Javascript
jQuery实现的多选框多级联动插件
2014/05/02 Javascript
JavaScript实现计算字符串中出现次数最多的字符和出现的次数
2015/03/12 Javascript
js的flv视频播放器插件使用方法
2015/06/23 Javascript
通过XMLHttpRequest和jQuery实现ajax的几种方式
2015/08/28 Javascript
jquery实现简洁文件上传表单样式
2015/11/02 Javascript
jsonp跨域请求数据实现手机号码查询实例分析
2015/12/12 Javascript
工作中常用的js、jquery自定义扩展函数代码片段汇总
2016/12/22 Javascript
webpack入门必知必会
2017/01/16 Javascript
Vue 2.0的数据依赖实现原理代码简析
2017/07/10 Javascript
解决vue路由后界面没有变化,但是链接有的问题
2018/09/01 Javascript
浅谈vue中resetFields()使用注意事项
2020/08/12 Javascript
JavaScript中CreateTextFile函数
2020/08/30 Javascript
[01:30]DOTA2上海特锦赛现场采访 Loda倾情献唱
2016/03/25 DOTA
[01:01:04]2018DOTA2亚洲邀请赛 4.5 淘汰赛 OpTic vs TNC 第一场
2018/04/06 DOTA
Python的Django框架中的数据库配置指南
2015/07/17 Python
Python实现求两个csv文件交集的方法
2017/09/06 Python
Python实用技巧之列表、字典、集合中根据条件筛选数据详解
2018/07/11 Python
Python3爬虫学习之爬虫利器Beautiful Soup用法分析
2018/12/12 Python
python虚拟环境完美部署教程
2019/08/06 Python
浅谈在django中使用redirect重定向数据传输的问题
2020/03/13 Python
Python爬虫基于lxml解决数据编码乱码问题
2020/07/31 Python
期终自我鉴定
2014/02/17 职场文书
自荐信的基本格式
2014/02/22 职场文书
上海世博会志愿者口号
2014/06/17 职场文书
会计岗位说明书
2014/07/29 职场文书
机关党员公开承诺书
2014/08/30 职场文书
综合办公室主任岗位职责
2015/04/01 职场文书
Redis延迟队列和分布式延迟队列的简答实现
2021/05/13 Redis
Javascript使用integrity属性进行安全验证
2021/11/07 Javascript