Quelle est la AngularJS chemin pour accéder aux cookies? J'ai vu des références à la fois un service et d'un module pour les cookies, mais pas d'exemples.
Est-il ou n'est-il pas un AngularJS approche canonique?
Réponses
Trop de publicités?
Cette réponse a été mis à jour pour refléter les dernières versions stables angularjs version. Une remarque importante est que $cookieStore est un wrapper mince entourant $cookies. Ils sont à peu près les mêmes en ce qu'ils fonctionnent uniquement avec les cookies de session. Bien que, ce qui répond à la question d'origine, il y a d'autres solutions, vous pourriez considérer comme l'utilisation de localstorage, ou jquery.cookie plugin (ce qui vous permettrait d'exercer un contrôle plus précis et ne serverside cookies. Bien sûr le faire dans angularjs veut probablement dire qu'on aurait envie de les envelopper d'un service et d'utilisation étendue.s'appliquent à informer angulaire de modifications de modèles (dans certains cas).
Un autre point à souligner c'est que il y a une légère différence entre les deux lors de l'extraction de données en fonction de si vous avez utilisé $cookie pour stocker de la valeur, ou, $cookieStore. Bien sûr, vous auriez vraiment envie d'utiliser l'un ou l'autre.
En plus de l'ajout de la référence à la js fichier dont vous avez besoin pour injecter ngCookies dans votre application définition comme:
angular.module('myApp', ['ngCookies']);
vous devriez être bon d'aller.
Voici une fonctionnelle minime exemple, où je montre que cookieStore est une mince wrapper autour de cookies:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<link rel="stylesheet" type="text/css" href="http://stackoverflow.com//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>
Les étapes sont les suivantes:
- inclure angular.js
- inclure angular-cookies.js
- injecter
ngCookiesdans votre application module (et assurez-vous de référence de ce module dans l'ng-appd'attribut) - ajouter un
$cookiesou$cookieStoreparamètre pour le contrôleur - accéder au cookie comme un membre de la variable en utilisant le point (.) opérateur -- OU --
- l'accès cookieStore utilisation de put/get méthodes
Uri
Points
987
C'est de cette façon que vous pouvez définir et obtenir des valeurs de cookie. C'est ce que j'ai été à l'origine à la recherche pour quand j'ai trouvé cette question.
Notez que nous utilisons $cookieStore au lieu de $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>
Ken Rimple
Points
96
Pour info, j'ai mis en place un JSFiddle de cette aide de l' $cookieStore, deux contrôleurs, un $rootScope, et AngularjS 1.0.6. C'est sur JSFifddle comme http://jsfiddle.net/krimple/9dSb2/ comme base si vous êtes déconner avec ce...
L'essentiel, c'est:
(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>
Espérons que cela aide ceux qui utilisent.
Ken
Andy Joslin
Points
23231
http://docs.angularjs.org/api/ngCookies.$cookieStore
Assurez-vous d'inclure http://code.angularjs.org/1.0.0rc10/angular-cookies-1.0.0rc10.js pour l'utiliser.
