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控制CSS样式,并且取消Css样式(如背景色,有实例)
Jul 09 Javascript
浅谈JavaScript函数参数的可修改性问题
Dec 05 Javascript
js实现文本框中输入文字页面中div层同步获取文本框内容的方法
Mar 03 Javascript
javascript实现表格增删改操作实例详解
May 15 Javascript
js中获取时间new Date()的全面介绍
Jun 20 Javascript
jQuery学习笔记——jqGrid的使用记录(实现分页、搜索功能)
Nov 09 Javascript
用iframe实现不刷新整个页面上传图片的实例
Nov 18 Javascript
js实现随机抽选效果、随机抽选红色球效果
Jan 13 Javascript
从零学习node.js之mysql数据库的操作(五)
Feb 24 Javascript
vue 标签属性数据绑定和拼接的实现方法
May 17 Javascript
js module大战
Apr 19 Javascript
使用vue-cli3 创建vue项目并配置VS Code 自动代码格式化 vue语法高亮问题
May 14 Javascript
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
wiki-shan写的php在线加密的解密程序
2008/09/07 PHP
flash用php连接数据库的代码
2011/04/21 PHP
将时间以距今多久的形式表示,PHP,js双版本
2012/09/25 PHP
jquery 学习笔记一
2010/04/07 Javascript
AeroWindow 基于JQuery的弹出窗口插件
2011/06/27 Javascript
JS定时器实例
2013/04/17 Javascript
禁用键盘上的(全局)指定键兼容iE、Chrome、火狐
2013/05/14 Javascript
通过AJAX的JS、JQuery两种方式解析XML示例介绍
2013/09/23 Javascript
js控制input输入字符解析
2013/12/27 Javascript
JS实现简单的键盘打字的效果
2015/04/24 Javascript
javascript元素动态创建实现方法
2015/05/13 Javascript
js采用concat和sort将N个数组拼接起来的方法
2016/01/21 Javascript
基于jQuery实现点击列表加载更多效果
2016/05/31 Javascript
移动端刮刮乐的实现方式(js+HTML5)
2017/03/23 Javascript
页面间固定参数,通过cookie传值的实现方法
2017/05/31 Javascript
JavaScript面向对象精要(下部)
2017/09/12 Javascript
JavaScript伪数组用法实例分析
2017/12/22 Javascript
vue的过滤器filter实例详解
2018/09/17 Javascript
微信小程序使用自定义组件导航实现当前页面高亮
2020/01/02 Javascript
JSON获取属性值方法代码实例
2020/06/30 Javascript
vuex中store存储store.commit和store.dispatch的用法
2020/07/24 Javascript
Python发送以整个文件夹的内容为附件的邮件的教程
2015/05/06 Python
python字符串编码识别模块chardet简单应用
2015/06/15 Python
Python根据区号生成手机号码的方法
2015/07/08 Python
python使用电子邮件模块smtplib的方法
2016/08/28 Python
解决Tensorboard可视化错误:不显示数据 No scalar data was found
2020/02/15 Python
罗兰·穆雷官网:Roland Mouret
2018/09/28 全球购物
最受欢迎的自我评价
2013/12/22 职场文书
护士演讲稿范文
2014/01/05 职场文书
合伙购房协议样本
2014/10/06 职场文书
政协工作总结2015
2015/05/20 职场文书
springboot临时文件存储目录配置方式
2021/07/01 Java/Android
mysql分表之后如何平滑上线详解
2021/11/01 MySQL
Python Django项目和应用的创建详解
2021/11/27 Python
CSS中float高度塌陷问题的四种解决方案
2022/04/18 HTML / CSS
python中pymysql包操作数据库方法
2022/04/19 Python