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 相关文章推荐
js 单引号 传递方法
Jun 22 Javascript
Javascript 阻止javascript事件冒泡,获取控件ID值
Jun 27 Javascript
基于jquery的button默认enter事件(回车事件)。
May 18 Javascript
让angularjs支持浏览器自动填表
Nov 10 Javascript
浅谈Web页面向后台提交数据的方式和选择
Sep 23 Javascript
Jquery实时监听input value的实例
Jan 26 Javascript
js实现多行文本框统计剩余字数功能
Mar 28 Javascript
JavaScript正则表达式简单实用实例
Jun 23 Javascript
利用node.js爬取指定排名网站的JS引用库详解
Jul 25 Javascript
vue购物车插件编写代码
Nov 27 Javascript
npm全局模块卸载及默认安装目录修改方法
May 15 Javascript
原生JavaScript实现的无缝滚动功能详解
Jan 17 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
历史证明,懒惰才是推动科学发展技术进步的动力
2021/03/02 无线电
php 常用算法和时间复杂度
2013/07/01 PHP
PHP使用GIFEncoder类生成gif动态滚动字幕
2014/07/01 PHP
Yii2中datetime类的使用
2016/12/17 PHP
PHP mkdir创建文件夹实现方法解析
2020/11/13 PHP
js对象的比较
2011/02/26 Javascript
背景图跟随鼠标移动的Mootools插件实现代码
2011/12/12 Javascript
document.documentElement的一些使用技巧
2013/04/18 Javascript
jquery限定文本框只能输入数字即整数和小数
2013/11/29 Javascript
jQuery避免$符和其他JS库冲突的方法对比
2014/02/20 Javascript
网页广告中JS代码的信息监听示例
2014/04/02 Javascript
jQuery绑定事件不执行但alert后可以正常执行
2014/06/03 Javascript
JavaScript节点及列表操作实例小结
2015/08/05 Javascript
JavaScript toUpperCase()方法使用详解
2016/08/26 Javascript
jQuery 插件封装的方法
2016/11/16 Javascript
jQuery元素选择器实例代码
2017/02/06 Javascript
Vue-cli创建项目从单页面到多页面的方法
2017/09/20 Javascript
微信小程序获取手机系统信息的方法【附源码下载】
2017/12/07 Javascript
vue自定义指令directive实例详解
2018/01/17 Javascript
基于layui数据表格以及传数据的方式
2018/08/19 Javascript
vue使用v-if v-show页面闪烁,div闪现的解决方法
2018/10/12 Javascript
javascript实现随机抽奖功能
2020/12/30 Javascript
[57:12]完美世界DOTA2联赛循环赛 Inki vs Matador BO2第一场 10.31
2020/11/02 DOTA
python实现异步回调机制代码分享
2014/01/10 Python
python的Template使用指南
2014/09/11 Python
Python编程判断一个正整数是否为素数的方法
2017/04/14 Python
Python 查找字符在字符串中的位置实例
2018/05/02 Python
Flask框架学习笔记之表单基础介绍与表单提交方式
2019/08/12 Python
Python绘制三角函数图(sin\cos\tan)并标注特定范围的例子
2019/12/04 Python
Django之form组件自动校验数据实现
2020/01/14 Python
H5 meta小结(前端必看篇)
2016/08/24 HTML / CSS
工商学院毕业生个人自我评价
2013/09/19 职场文书
历史系自荐信范文
2013/12/24 职场文书
《微笑着面对生活》优秀演讲稿范文
2014/09/23 职场文书
2015年大学生入党自荐书
2015/03/24 职场文书
幼儿园秋季开学通知
2015/07/16 职场文书