web-dev-qa-db-fra.com

Pourquoi suis-je incapable d'injecter des biscuits angulaires?

J'ai

<body ng-app="myApp">
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular-cookies.min.js">
    </script>
</body>

Tout se charge correctement. 

Ensuite, dans mon javascript, je tente d’injecter des ngCookies:

angular.module("myApp", ["ngCookies"]).
    config(function($cookies) {
         console.log($cookies.myCookie);
    });

Mais il ne semble pas y avoir de $ cookies:

 Unknown provider: $cookies from myApp
28
Jeff Wong

Je ne sais pas quel est votre cas d'utilisation fonctionnel, mais vous ne pouvez pas injecter de services ($cookies est un service) à l'intérieur de blocs de configuration. Seules les constantes et les fournisseurs peuvent être injectés dans des blocs de configuration.

Vous pouvez injecter des services dans des blocs d'exécution, mais je ne sais pas si cela vous aide, car je ne suis pas sûr de ce que vous essayez de faire avec ces cookies. 

BTW: vous semblez mélanger les versions du fichier angulaire principal et du module ngCookies. Ce n'est pas directement lié à votre problème, mais c'est plutôt étrange.

28

Vous pouvez l'injecter manuellement:

myApp.config(function() {
  var $cookies;
  angular.injector(['ngCookies']).invoke(['$cookies', function(_$cookies_) {
    $cookies = _$cookies_;
  }]);

  // here you can use $cookies as usual
});

Vous vous demandez peut-être pourquoi nous devons spécifier ngCookies dans l'appel injector() et WELL pour l'appel .invoke()?

ngCookies est le nom du module (vous devez avoir angular-cookies.js dans votre projet pour pouvoir utiliser ce module). Lorsque vous créez un injecteur en appelant injector(), vous spécifiez les modules à utiliser pour que les services de ces modules puissent être utilisés.

invoke() appelle une fonction mais vous permet de spécifier les services (fournis par différents modules) qui doivent être passés à la fonction (dans notre cas, le service fourni par le module ngCookies est nommé $cookies)

Cette solution est un peu un bidouillage, car vous créez manuellement un nouvel injecteur distinct de celui que votre application angulaire crée et utilise automatiquement, mais elle devrait être sûre, car ngCookie semble utiliser uniquement des fonctionnalités d'angulaire propre état et ne sont que de minces wrappers de la fonctionnalité du navigateur.

11
Kamil Szot

J'ai rencontré le même problème ... La version angulaire et la version des cookies angulaires ne correspondaient pas ... Ce que j'ai fait pour résoudre le problème est de mettre à jour bower.json avec une version fonctionnelle des deux.

"angular": ">=1.2.*",
"angular-cookies": ">=1.2.*"

Puis j'ai couru:

bower install

j'ai eu cette question:

Unable to find a suitable version for angular, please choose one:
1) angular#1.3.13 which resolved to 1.3.13 and is required by angular-cookies#1.3.13 
2) angular#>=1.2.x <=1.4.x which resolved to 1.3.16 and is required by oclazyload#1.0.1 
3) angular#1.4.0 which resolved to 1.4.0 and is required by angular-cookies#1.4.0 
4) angular#>=1.2.* which resolved to 1.4.0 and is required by hashve 
5) angular#>=1 which resolved to 1.4.0 and is required by angular-bootstrap#0.11.2 
6) angular#>=1.2.26 <=1.5 which resolved to 1.4.0 and is required by angular-translate#2.7.2 
7) angular#~1.x which resolved to 1.4.0 and is required by restangular#1.5.1 
8) angular#^1.2.6 which resolved to 1.4.0 and is required by angular-socket-io#0.6.1 
9) angular#>= 1.0.8 which resolved to 1.4.0 and is required by angular-ui-router#0.2.15 
10) angular#>=1.2.0 <1.5.0 which resolved to 1.4.0 and is required by angular-moment#0.10.1Prefix the choice with ! to persist it to bower.json

Puis j'ai choisi 3.

et cela a fonctionné.

2
shacharsol

Comme tout le monde le dit, vous ne pouvez pas utiliser le service de cookies angulaires. Cependant, aucune loi connue ne dit que vous ne pouvez pas simplement utiliser document.cookie pour y accéder et l'analyser vous-même. Alternativement, vous pouvez créer votre propre fournisseur qui vous donne accès aux cookies et vous pouvez l'injecter. S'il vous plaît rappelez-vous que angular est simplement un framework et lorsque celui-ci a des limitations, vous devez vous rappeler d'utiliser quelque chose appelé javascript.

0
Pbrain19

D'après https://stackoverflow.com/a/18971123/132374 , il semble que vous ayez besoin de supprimer "ngCookies" dans votre module de service si vous n'avez pas déjà:

var serviceModule = angular.app('App.services', ['ngCookies']);

Cela a fonctionné pour moi. N'oubliez pas que $cookies ne fonctionne que dans les cas où Angular vous permet d'injecter des services (voir la réponse acceptée pour plus de détails).

0
Jon Onstott