web-dev-qa-db-fra.com

Angularjs permet-il de définir des constantes avec d'autres constantes?

J'essaie de définir des constantes avec d'autres constantes, mais il semble que cela ne puisse pas être fait, car la constante initiale n'est pas prête lorsque la constante requise dépend de l'exiger. Je veux être sûr si ce n'est pas possible du tout.

Actuellement, j'ai des constantes de cette façon:

angular.module('mainApp.config', [])
    .constant('RESOURCE_USERS_DOMAIN', 'http://127.0.0.1:8008')
    .constant('RESOURCE_USERS_API', 'http://127.0.0.1:8008/users')
    // Specific routes for API
    .constant('API_BASIC_INFORMATION', RESOURCE_USERS_API + '/api/info')
    .constant('API_SOCIAL_NETWORKS', RESOURCE_USERS_API + '/api/social')
    ;

Les deux secondes constantes sont ce que je veux accomplir

75
raulricardo21

La méthode angular pour définir les dépendances entre les contrôleurs, les services et d’autres est par injection de dépendance (DI). Donc, si vous avez un contrôleur A qui dépend d’un service B, vous devez le créer comme ceci.

var myApp = angular.module("exampleApp",[]);

myApp.controller("aCtrl", function(serviceB){
    //Controller functionally here
});

Voir, angular vérifiera la dépendance serviceB et recherchera le service que vous avez créé avec ce nom. Si vous n'en créez pas, vous obtiendrez une erreur.

Donc, si vous voulez créer une constante A qui dépend de la constante B, vous devez dire à angular que A dépend de B. Mais la constante ne peut pas avoir de dépendance. Une constante peut retourner une fonction, mais la DI ne fonctionnera pas pour la constante. Vérifiez ceci Fiddle afin que vous puissiez voir pour quelles méthodes DI fonctionne.

Donc, pour répondre à votre question, vous ne pouvez pas définir une constante avec d'autres constantes.

Mais vous pouvez faire ceci:

angular.module('projectApp', [])
  .constant('domain','http://somedomain.com')
  .constant('api','/some/api/info')
  .service('urls',function(domain,api){ this.apiUrl = domain+api;})

  .controller('mainCtrl',function($scope,urls) {

      $scope.url = urls.apiUrl;

  });

Vérifiez ceci violon pour le voir fonctionner:

Si vous voulez en savoir plus sur DI, regardez ceci post .

J'espère que cela peut répondre à votre question.

45
lao

Un moyen facile de faire ceci est comme ceci:

var myApp = angular.module("exampleApp",[]);

myApp.constant('RESOURCES', (function() {
  // Define your variable
  var resource = 'http://127.0.0.1:8008';
  // Use the variable in your constants
  return {
    USERS_DOMAIN: resource,
    USERS_API: resource + '/users',
    BASIC_INFO: resource + '/api/info'
  }
})());

Et utilisez les constantes comme ceci:

myApp.controller("ExampleCtrl", function(RESOURCES){
  $scope.domain = RESOURCES.USERS_DOMAIN;
});

Crédits: lien

146
Linkmichiel

Je fais ça comme ça:

var constants = angular.module('constants', []);

constants.factory("Independent", [function() {
   return {
      C1: 42
   }
}]);

constants.factory('Constants', ["Independent", function(I) {
   return {
      ANSWER_TO_LIFE: I.C1
   }
}]);
11
Beterraba

Tant que vous n'avez pas besoin d'accéder à votre constante dans les fournisseurs, cela devrait fonctionner correctement:

.constant('Host', 'localhost')
.factory('URL', function(Host) { return "http://" + Host })

Si vous avez besoin d'accéder à vos constantes dans les fournisseurs, alors je suppose que vous devez faire plus de travail:

.constants('Host', 'localhost')
.provider('DOMAIN', function(Host) {
    var domain = "http://" + Host;
    this.value = function() { return domain };
    this.$get = this.value;
 })
 .provider("anyOtherProvider", function(DOMAINPovider) {
     var domain = DOMAINProvider.value();
 };
 .factory("anyOtherService", function(DOMAIN) {
 })
8
Peter Rietzler

Je ne peux pas dire avec certitude si c'est (im) possible. Toutefois, une solution de contournement consisterait à définir les constantes de base en tant que constantes régulières et les ordres supérieurs en tant que services utilisant des fermetures pour s’assurer qu’elles ne peuvent pas être modifiées.

Exemple approximatif:

angular.module('myApp').constant('BASE_CONSTS',{
    'FIRST_CONST': '10',
    'SECOND_CONST': '20'
});

angular.module('myServices').factory('MyServiceName', ['BASE_CONSTS', function ('BASE_CONSTS') {
    var SECOND_ORDER_CONST = BASE_CONSTS.FIRST_CONST * 100;
    return {
        GET_SECOND_ORDER_CONST: function() {
            return SECOND_ORDER_CONST;
        }
    }
}]);

Et utilisez-le après avoir injecté le service:

MyServiceName.GET_SECOND_ORDER_CONST();

Pas très élégant, mais devrait faire le travail.

4
Thalis K.

La solution fournie par @Linkmichiel est bonne, mais si vous voulez utiliser désespérément une constante dans une autre, vous pouvez les combiner dans le bloc config:

angular.module("exampleApp", [])

.constant('BASE_URL', 'http://127.0.0.1:8008')

.constant('RESOURCES', {
  USERS_DOMAIN: '',
  USERS_API: '/users',
  BASIC_INFO: '/api/info'
})

.config(function(BASE_URL, RESOURCES) {
  for (prop in RESOURCES) {
    RESOURCES[prop] = BASE_URL + RESOURCES[prop];
  }
})

.controller('WhatIsInResourcesController', function($scope, RESOURCES) {
  $scope.RESOURCES = RESOURCES;
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="exampleApp">
  <div ng-controller="WhatIsInResourcesController">
    <pre>{{ RESOURCES | json }}</pre>
  </div>
</div>

Après la phase de configuration, toutes les constantes seront configurées correctement (essayez l'extrait de code).

La morale de l'histoire est la suivante: Angular est tellement cool que vous pouvez même changer les constantes.

2
fracz