AngularJS访问cookie的方式是什么?我看到了对cookie的服务和模块的引用，但没有示例。
有没有AngularJS的规范方法?
当前回答
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包。
其他回答
cookieStore美元http://docs.angularjs.org/api/ngCookies。
确保包含http://code.angularjs.org/1.0.0rc10/angular-cookies-1.0.0rc10.js来使用它。
This answer has been updated to reflect latest stable angularjs version. One important note is that $cookieStore is a thin wrapper surrounding $cookies. They are pretty much the same in that they only work with session cookies. Although, this answers the original question, there are other solutions you may wish to consider such as using localstorage, or jquery.cookie plugin (which would give you more fine-grained control and do serverside cookies. Of course doing so in angularjs means you probably would want to wrap them in a service and use $scope.apply to notify angular of changes to models (in some cases).
另一个注意事项是，在提取数据时，两者之间有轻微的区别，这取决于您是使用$cookie存储值还是使用$cookieStore。当然，你真的想要使用其中一个。
除了添加对js文件的引用，你还需要将ngCookies注入到你的应用定义中，例如:
angular.module('myApp', ['ngCookies']);
然后你就可以出发了。
下面是一个函数最小化的例子，其中我展示了cookie estore是一个围绕cookie的薄包装器:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body ng-controller="MyController">
<h3>Cookies</h3>
<pre>{{usingCookies|json}}</pre>
<h3>Cookie Store</h3>
<pre>{{usingCookieStore|json}}</pre>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular-cookies.js"></script>
<script>
angular.module('myApp', ['ngCookies']);
app.controller('MyController',['$scope','$cookies','$cookieStore',
function($scope,$cookies,$cookieStore) {
var someSessionObj = { 'innerObj' : 'somesessioncookievalue'};
$cookies.dotobject = someSessionObj;
$scope.usingCookies = { 'cookies.dotobject' : $cookies.dotobject, "cookieStore.get" : $cookieStore.get('dotobject') };
$cookieStore.put('obj', someSessionObj);
$scope.usingCookieStore = { "cookieStore.get" : $cookieStore.get('obj'), 'cookies.dotobject' : $cookies.obj, };
}
</script>
</body>
</html>
步骤如下:
包括angular.js 包括angular-cookies.js 注入ngCookies到你的app模块中(并确保你在ng-app属性中引用了该模块) 添加一个$cookies或$cookieStore参数到控制器 使用点(.)操作符将cookie作为成员变量访问 ——或—— 使用put/get方法访问cookestore
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。
下面是一个使用$cookies的简单示例。单击按钮后，cookie将被保存，重新加载页面后，cookie将被恢复。
app.html:
<html ng-app="app">
<head>
<meta charset="utf-8" />
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular-cookies.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="appController as vm">
<input type="text" ng-model="vm.food" placeholder="Enter food" />
<p>My favorite food is {{vm.food}}.</p>
<p>Open new window, then press Back button.</p>
<button ng-click="vm.openUrl()">Open</button>
</body>
</html>
app.js:
(function () {
"use strict";
angular.module('app', ['ngCookies'])
.controller('appController', ['$cookies', '$window', function ($cookies, $window) {
var vm = this;
//get cookie
vm.food = $cookies.get('myFavorite');
vm.openUrl = function () {
//save cookie
$cookies.put('myFavorite', vm.food);
$window.open("http://www.google.com", "_self");
};
}]);
})();
这就是如何设置和获取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中访问cookie ?
- AngularJS模板中的三元运算符
- 在angularJS中& vs @和=的区别是什么
- 如何/何时使用ng-click调用路由?
- 在Angular JS中的控制器之间传递数据?
- 在ng-repeat结束时调用函数
- 我怎样才能获得承诺的价值?
- 我应该使用' this '还是' $scope ' ?
- Angular IE缓存$http的问题
- 删除数组的第一项(比如从堆栈中弹出)
- 从AngularJS的url中删除片段标识符(# symbol)
- AngularJS For循环与数字和范围
- 如何在AngularJS中进行分页?
- AngularJS $http和$resource
