Angularjs cookie 操作实例详解


Posted in Javascript onSeptember 27, 2017

摘要

现在很多app采用内嵌h5的方式进行开发,有些数据会存在webveiw的cookie中,那么如果使用angularjs开发单页应用,就需要用到angularjs的cookie操作。这里提供一个简单的学习demo。方便快速上手。

一个例子

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" ng-app="myapp">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title></title>
  <script src="Scripts/angular.js"></script>
  <script src="Scripts/angular-cookies.js"></script>
  <script>
    angular.module("myapp", ["ngCookies"]).controller("TestController", function ($cookies) {     // Put cookie
      $cookies.put('mytest', 'mytest');
      // Get cookie
      var mytestCookie = $cookies.get('mytest');
      console.log(mytestCookie)
      // Removing a cookie
      // $cookie.remove('mytest');
      console.log($cookies.get('mytest'));
    });
  </script>
</head>
<body ng-controller="TestController">
</body>
</html>

测试结果

Angularjs cookie 操作实例详解

可以看到上面结果设置成功了,但过期时间是session,这种cookie是跟当前会话相同了,也就是关闭浏览器之后就会消失,这是因为我们没有设置cookie的过期时间造成了,可以通过下面的方式设置过期时间。

var expireDate = new Date();
      expireDate.setDate(expireDate.getDate() + 30);//设置cookie保存30天
      // Put cookie
      $cookies.put('mytest', 'mytest', { 'expires': expireDate });

Angularjs cookie 操作实例详解

总结

这里需要注意,在网上看到很多实用$cookieStore的,确实可以设置成功,但设置过期时间的时候会失效,建议采用$cookies

以上所述是小编给大家介绍的Angularjs cookie 操作实例详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JQuery下关于$.Ready()的分析
Dec 13 Javascript
Javascript实现CheckBox的全选与取消全选的代码
Jul 20 Javascript
用RadioButten或CheckBox实现div的显示与隐藏
Sep 21 Javascript
javascript 弹出的窗口返回值给父窗口具体实现
Nov 23 Javascript
js模拟点击以提交表单为例兼容主流浏览器
Nov 29 Javascript
AngularJS基础 ng-keypress 指令简单示例
Aug 02 Javascript
快速搭建React的环境步骤详解
Nov 06 Javascript
node实现登录图片验证码的示例代码
Apr 20 Javascript
详解Vue实战指南之依赖注入(provide/inject)
Nov 13 Javascript
Vue内部渲染视图的方法
Sep 02 Javascript
浅谈JavaScript中this的指向问题
Jul 28 Javascript
解决vue页面刷新,数据丢失的问题
Nov 24 Vue.js
js移动端图片压缩上传功能
Aug 18 #Javascript
微信小程序报错:this.setData is not a function的解决办法
Sep 27 #Javascript
EasyUI Tree树组件无限循环的解决方法
Sep 27 #Javascript
详解微信小程序Page中data数据操作和函数调用
Sep 27 #Javascript
深入理解Vue生命周期、手动挂载及挂载子组件
Sep 27 #Javascript
微信小程序中button组件的边框设置的实例详解
Sep 27 #Javascript
使用javaScript实现鼠标拖拽事件
Apr 03 #Javascript
You might like
php面向对象全攻略 (十) final static const关键字的使用
2009/09/30 PHP
Notice: Undefined index: page in E:\PHP\test.php on line 14
2010/11/02 PHP
PHP连接access数据库
2015/03/27 PHP
php封装的page分页类完整实例
2016/10/18 PHP
php 删除一维数组中某一个值元素的操作方法
2018/02/01 PHP
PHP强制转化的形式整理
2020/05/22 PHP
PHP7新增函数
2021/03/09 PHP
JavaScript 高级语法介绍
2009/06/15 Javascript
Javascript中 关于prototype属性实现继承的原理图
2013/04/16 Javascript
实现只能输入数字的input不用replace方法
2013/09/12 Javascript
js实现的Easy Tabs选项卡用法实例
2015/09/06 Javascript
jQuery Real Person验证码插件防止表单自动提交
2015/11/06 Javascript
jQuery实现广告条滚动效果
2017/08/22 jQuery
js实现关闭网页出现是否离开提示
2017/12/07 Javascript
Vue 中的compile操作方法
2018/02/26 Javascript
Vuex中mutations与actions的区别详解
2018/03/01 Javascript
微信小程序实现动态获取元素宽高的方法分析
2018/12/10 Javascript
JavaScript this关键字指向常用情况解析
2020/09/02 Javascript
利用Vue实现简易播放器的完整代码
2020/12/30 Vue.js
用Python中的字典来处理索引统计的方法
2015/05/05 Python
从Python的源码来解析Python下的freeblock
2015/05/11 Python
Python3利用SMTP协议发送E-mail电子邮件的方法
2017/09/30 Python
浅谈numpy数组中冒号和负号的含义
2018/04/18 Python
Python实现判断一行代码是否为注释的方法
2018/05/23 Python
Python闭包执行时值的传递方式实例分析
2018/06/04 Python
python实现广度优先搜索过程解析
2019/10/19 Python
通过实例简单了解Python sys.argv[]使用方法
2020/08/04 Python
python excel和yaml文件的读取封装
2021/01/12 Python
int和Integer有什么区别
2013/05/25 面试题
士力架广告词
2014/03/20 职场文书
活动策划求职信模板
2014/04/21 职场文书
争先创优公开承诺书
2014/08/30 职场文书
民用住房租房协议书
2014/10/29 职场文书
2015年新教师个人工作总结
2015/10/14 职场文书
《蚂蚁和蝈蝈》教学反思
2016/02/22 职场文书
Java数据开发辅助工具Docker与普通程序使用方法
2021/09/15 Java/Android