Angularjs cookie 操作實(shí)例詳解
摘要
現(xiàn)在很多app采用內(nèi)嵌h5的方式進(jìn)行開(kāi)發(fā)，有些數(shù)據(jù)會(huì)存在webveiw的cookie中，那么如果使用angularjs開(kāi)發(fā)單頁(yè)應(yīng)用，就需要用到angularjs的cookie操作。這里提供一個(gè)簡(jiǎn)單的學(xué)習(xí)demo。方便快速上手。
一個(gè)例子
<!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>
測(cè)試結(jié)果
可以看到上面結(jié)果設(shè)置成功了，但過(guò)期時(shí)間是session，這種cookie是跟當(dāng)前會(huì)話相同了，也就是關(guān)閉瀏覽器之后就會(huì)消失，這是因?yàn)槲覀儧](méi)有設(shè)置cookie的過(guò)期時(shí)間造成了，可以通過(guò)下面的方式設(shè)置過(guò)期時(shí)間。
var expireDate = new Date();
expireDate.setDate(expireDate.getDate() + 30);//設(shè)置cookie保存30天
// Put cookie
$cookies.put('mytest', 'mytest', { 'expires': expireDate });
總結(jié)
這里需要注意，在網(wǎng)上看到很多實(shí)用$cookieStore的，確實(shí)可以設(shè)置成功，但設(shè)置過(guò)期時(shí)間的時(shí)候會(huì)失效，建議采用$cookies
以上所述是小編給大家介紹的Angularjs cookie 操作實(shí)例詳解，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
AngularJS入門(mén)教程之AngularJS 模板
本文主要介紹AngularJS 模板，這里整理了詳細(xì)相關(guān)資料，并附示例代碼，有興趣的小伙伴可以參考下2016-08-08
深入探究AngularJs之$scope對(duì)象（作用域）
本篇文章主要介紹了深入探究AngularJs之$scope對(duì)象（作用域），具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
Angular2實(shí)現(xiàn)組件交互的方法分析
這篇文章主要介紹了Angular2實(shí)現(xiàn)組件交互的方法,結(jié)合實(shí)例形式總結(jié)分析了Angular2中組件交互的相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下2017-12-12
在 Angular 中使用 ViewChild 訪問(wèn)子組件、指令或 D
這篇文章主要介紹了如何在 Angular 中使用 ViewChild 來(lái)訪問(wèn)子組件、指令或 DOM 元素,在本教程中,您使用了 ViewChild 來(lái)從父組件類中訪問(wèn)指令、子組件和 DOM 元素,需要的朋友可以參考下2024-08-08
Angularjs 實(shí)現(xiàn)動(dòng)態(tài)添加控件功能
這篇文章主要介紹了Angularjs 實(shí)現(xiàn)動(dòng)態(tài)添加控件功能,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2017-05-05
這篇文章主要介紹了angularjs的一些優(yōu)化小技巧,本文總結(jié)了5種優(yōu)化技巧,如一次綁定、盡可能少調(diào)用 ng-repeat、盡量在指令里寫(xiě)原生語(yǔ)法、頁(yè)面內(nèi)盡量少用filters等,需要的朋友可以參考下2014-12-12
$scope 的使用貫穿整個(gè) Angular App 應(yīng)用,它與數(shù)據(jù)模型相關(guān)聯(lián),同時(shí)也是表達(dá)式執(zhí)行的上下文.有了 $scope 就在視圖和控制器之間建立了一個(gè)通道,基于作用域視圖在修改數(shù)據(jù)時(shí)會(huì)立刻更新 $scope,同樣的 $scope 發(fā)生改變時(shí)也會(huì)立刻重新渲染視圖.2016-08-08
這篇文章主要介紹了解決ionic和angular上拉加載的問(wèn)題,需要的朋友可以參考下2017-08-08
angularjs實(shí)現(xiàn)簡(jiǎn)單的購(gòu)物車功能
這篇文章主要為大家詳細(xì)介紹了angularjs實(shí)現(xiàn)簡(jiǎn)單的購(gòu)物車功能 ，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-09-09
本文通過(guò)實(shí)例代碼給大家介紹了AngularJS日程表案例詳解，通過(guò)簡(jiǎn)單代碼實(shí)現(xiàn)了添加事件/完成事件/刪除事件功能，具體代碼大家參考下本文2017-08-08