AngularJS访问cookie的方式是什么?我看到了对cookie的服务和模块的引用，但没有示例。
有没有AngularJS的规范方法?
当前回答
最初接受的答案提到了jquery。饼干插件。几个月前，它被重命名为js-cookie，并删除了jQuery依赖项。其中一个原因是为了让它更容易与其他框架集成，比如Angular。
现在，如果你想把js-cookie和angular集成起来，就像这样简单:
module.factory( "cookies", function() {
return Cookies.noConflict();
});
就是这样。没有jQuery。没有ngCookies。
您还可以创建自定义实例来处理编写方式不同的特定服务器端cookie。以PHP为例，它将服务器端的空格转换为加号+，而不是百分号编码:
module.factory( "phpCookies", function() {
return Cookies
.noConflict()
.withConverter(function( value, name ) {
return value
// Decode all characters according to the "encodeURIComponent" spec
.replace(/(%[0-9A-Z]{2})+/g, decodeURIComponent)
// Decode the plus sign to spaces
.replace(/\+/g, ' ')
});
});
自定义提供者的用法是这样的:
module.service( "customDataStore", [ "phpCookies", function( phpCookies ) {
this.storeData = function( data ) {
phpCookies.set( "data", data );
};
this.containsStoredData = function() {
return phpCookies.get( "data" );
}
}]);
我希望这能对大家有所帮助。
查看详细信息:https://github.com/js-cookie/js-cookie/issues/103
有关如何与服务器端集成的详细文档，请参阅这里:https://github.com/js-cookie/js-cookie/blob/master/SERVER_SIDE.md
其他回答
最初接受的答案提到了jquery。饼干插件。几个月前，它被重命名为js-cookie，并删除了jQuery依赖项。其中一个原因是为了让它更容易与其他框架集成，比如Angular。
现在，如果你想把js-cookie和angular集成起来，就像这样简单:
module.factory( "cookies", function() {
return Cookies.noConflict();
});
就是这样。没有jQuery。没有ngCookies。
您还可以创建自定义实例来处理编写方式不同的特定服务器端cookie。以PHP为例，它将服务器端的空格转换为加号+，而不是百分号编码:
module.factory( "phpCookies", function() {
return Cookies
.noConflict()
.withConverter(function( value, name ) {
return value
// Decode all characters according to the "encodeURIComponent" spec
.replace(/(%[0-9A-Z]{2})+/g, decodeURIComponent)
// Decode the plus sign to spaces
.replace(/\+/g, ' ')
});
});
自定义提供者的用法是这样的:
module.service( "customDataStore", [ "phpCookies", function( phpCookies ) {
this.storeData = function( data ) {
phpCookies.set( "data", data );
};
this.containsStoredData = function() {
return phpCookies.get( "data" );
}
}]);
我希望这能对大家有所帮助。
查看详细信息:https://github.com/js-cookie/js-cookie/issues/103
有关如何与服务器端集成的详细文档，请参阅这里:https://github.com/js-cookie/js-cookie/blob/master/SERVER_SIDE.md
供你参考，我用$cookieStore、两个控制器、$rootScope和AngularjS 1.0.6组合了一个JSFiddle。它在JSFifddle的http://jsfiddle.net/krimple/9dSb2/作为一个基地，如果你搞砸了这个…
它的要点是:
Javascript
var myApp = angular.module('myApp', ['ngCookies']);
myApp.controller('CookieCtrl', function ($scope, $rootScope, $cookieStore) {
$scope.bump = function () {
var lastVal = $cookieStore.get('lastValue');
if (!lastVal) {
$rootScope.lastVal = 1;
} else {
$rootScope.lastVal = lastVal + 1;
}
$cookieStore.put('lastValue', $rootScope.lastVal);
}
});
myApp.controller('ShowerCtrl', function () {
});
HTML
<div ng-app="myApp">
<div id="lastVal" ng-controller="ShowerCtrl">{{ lastVal }}</div>
<div id="button-holder" ng-controller="CookieCtrl">
<button ng-click="bump()">Bump!</button>
</div>
</div>
Angular在1.4版弃用了$cookieStore。因此，如果你使用的是最新版本的angular. X，请使用$cookies。$cookieStore和$cookies的语法保持不变:
$cookies.put("key", "value");
var value = $cookies.get("key");
有关API的概述，请参阅文档。还要注意的是，cookie服务已经增强了一些新的重要功能，比如设置过期时间(见这个答案)和域名(见CookiesProvider文档)。
请注意，在版本1.3中。X或以下，$cookies的语法与上面不同:
$cookies.key = "value";
var value = $cookies.value;
此外，如果您正在使用bower，请确保正确键入软件包名称:
bower install angular-cookies@X.Y.Z
其中X.Y.Z是你正在运行的AngularJS版本。 在凉亭"angular-cookie"中还有一个包(没有's')，它不是正式的angular包。
这就是如何设置和获取cookie值。这就是我找到这个问题的初衷。
注意，我们使用$cookieStore而不是$cookies
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script src="http://code.angularjs.org/1.0.0rc10/angular-1.0.0rc10.js"></script>
<script src="http://code.angularjs.org/1.0.0rc10/angular-cookies-1.0.0rc10.js"></script>
<script>
angular.module('myApp', ['ngCookies']);
function CookieCtrl($scope, $cookieStore) {
$scope.lastVal = $cookieStore.get('tab');
$scope.changeTab = function(tabName){
$scope.lastVal = tabName;
$cookieStore.put('tab', tabName);
};
}
</script>
</head>
<body ng-controller="CookieCtrl">
<!-- ... -->
</body>
</html>
AngularJS提供了ngCookies模块和$cookieStore服务来使用浏览器cookie。
我们需要添加angular-cookies.min.js文件来使用cookie特性。
下面是AngularJS Cookie的一些方法。
(关键);//该方法返回给定cookie key的值。 getObject(关键);//该方法返回给定对象的反序列化值 饼干的关键。 getAll ();//该方法返回一个键值对象 饼干。 Put (key, value， [options]);//该方法设置一个给定的值 饼干的关键。 删除(关键,[选项]);//此方法删除给定的cookie。
例子
Html
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.1/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.1/angular-cookies.min.js"></script>
</head>
<body ng-controller="MyController">
{{cookiesUserName}} loves {{cookietechnology}}.
</body>
</html>
JavaScript
var myApp = angular.module('myApp', ['ngCookies']);
myApp.controller('MyController', ['$scope', '$cookies', '$cookieStore', '$window', function($scope, $cookies, $cookieStore, $window) {
$cookies.userName = 'Max Joe';
$scope.cookiesUserName = $cookies.userName;
$cookieStore.put('technology', 'Web');
$scope.cookietechnology = $cookieStore.get('technology'); }]);
我已经参考了http://www.tutsway.com/simple-example-of-cookie-in-angular-js.php。
推荐文章
- 如何从控制器函数切换视图?
- 如何在AngularJS中访问cookie ?
- AngularJS模板中的三元运算符
- 在angularJS中& vs @和=的区别是什么
- 如何/何时使用ng-click调用路由?
- 在Angular JS中的控制器之间传递数据?
- 在ng-repeat结束时调用函数
- 我怎样才能获得承诺的价值?
- 我应该使用' this '还是' $scope ' ?
- Angular IE缓存$http的问题
- 删除数组的第一项(比如从堆栈中弹出)
- 从AngularJS的url中删除片段标识符(# symbol)
- AngularJS For循环与数字和范围
- 如何在AngularJS中进行分页?
- AngularJS $http和$resource
