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 相关文章推荐
静态的动态续篇之来点XML
Aug 15 Javascript
script标签的 charset 属性使用说明
Dec 04 Javascript
JS获取后台Cookies值的小例子
Mar 04 Javascript
JS验证input输入框(字母,数字,符号,中文)
Mar 23 Javascript
JavaScript之RegExp_动力节点Java学院整理
Jun 29 Javascript
jQuery 实现图片的依次加载图片功能
Jul 06 jQuery
vue-awesome-swiper滑块插件使用方法详解
Nov 27 Javascript
详解react native页面间传递数据的几种方式
Nov 07 Javascript
小程序如何支持使用 async/await详解
Sep 12 Javascript
node.js使用mongoose操作数据库实现购物车的增、删、改、查功能示例
Dec 23 Javascript
基于JavaScript实现简单抽奖功能代码实例
Oct 20 Javascript
使用refresh_token实现无感刷新页面
Apr 26 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
Win2000+Apache+MySql+PHP4+PERL安装使用小结
2006/10/09 PHP
PHP __autoload函数(自动载入类文件)的使用方法
2012/02/04 PHP
PHP基于自增数据如何生成不重复的随机数示例
2017/05/19 PHP
Mac系统完美安装PHP7详细教程
2017/06/06 PHP
php面向对象程序设计中self与static的区别分析
2019/05/21 PHP
jquery DIV撑大让滚动条滚到最底部代码
2013/06/06 Javascript
js设置function参数默认值(适合没有传参情况)
2014/02/24 Javascript
js数值和和字符串进行转换时可以对不同进制进行操作
2014/03/05 Javascript
For循环中分号隔开的3部分的执行顺序探讨
2014/05/27 Javascript
JavaScript通过元素的ID和name设置样式
2014/07/08 Javascript
Nodejs为什么选择javascript为载体语言
2015/01/13 NodeJs
JavaScript调用传递变量参数的相关问题及解决办法
2015/11/01 Javascript
jQuery中的deferred对象和extend方法详解
2017/05/08 jQuery
AngularJS实现表格的增删改查(仅限前端)
2017/07/04 Javascript
在Vue中如何使用Cookie操作实例
2017/07/27 Javascript
vue cli 全面解析
2018/02/28 Javascript
p5.js 毕达哥拉斯树的实现代码
2018/03/23 Javascript
用react-redux实现react组件之间数据共享的方法
2018/06/08 Javascript
微信小程序实现省市区三级地址选择
2020/06/21 Javascript
基于ajax实现上传图片代码示例解析
2020/12/03 Javascript
Python同时向控制台和文件输出日志logging的方法
2015/05/26 Python
wxPython之解决闪烁的问题
2018/01/15 Python
python 定时修改数据库的示例代码
2018/04/08 Python
sklearn线性逻辑回归和非线性逻辑回归的实现
2020/06/09 Python
python pymysql库的常用操作
2020/10/16 Python
纯CSS3单页切换导航菜单界面设计的简单实现
2016/08/16 HTML / CSS
使用Canvas操作像素的方法
2018/06/14 HTML / CSS
英国在线房屋中介网站:Yopa
2018/01/09 全球购物
C/C++程序员常见面试题二
2015/11/19 面试题
仓库管理专业个人的自我评价
2013/12/30 职场文书
资源工程专业毕业生求职信
2014/02/27 职场文书
小学教师见习总结
2015/06/23 职场文书
2015年秋季小学开学标语
2015/07/16 职场文书
2016新春团拜会致辞
2015/08/01 职场文书
JS ES6异步解决方案
2021/04/29 Javascript
vue如何在data中引入图片的正确路径
2022/06/05 Vue.js