Quels fournisseurs/services sont disponibles dans module.config ?

Question

Je souhaite utiliser $document pour récupérer une valeur de serveur à partir d'un champ de saisie.

var base_url = $document[0].getElementById('BaseUrl').value;

L'URL de base est utilisée pour récupérer des modèles.

var base_url = $document[0].getElementById('BaseUrl').value;

$routeProvider.when('/alert', {
  controller: function () { },
  templateUrl: base_url + '/partials/instances.html'
});

Puisque $document renvoie une erreur inconnue, je suppose qu'il n'est pas disponible dans la configuration ?Existe-t-il un moyen de savoir ce qui est disponible et ce qui ne l'est pas ?Je pourrais également utiliser $http pour obtenir des données du serveur, mais ce n'est pas non plus disponible.

Answer 1

Les modules AngularJS sont démarrés en 2 phases :

• Configuration phase où seuls les fournisseurs et les constantes sont disponibles.
• Run phase où les services sont instanciés sur la base de fournisseurs enregistrés.Dans cette phase, les constantes sont toujours disponibles mais pas les fournisseurs.

L'AngularJS Documentation (section:"Chargement et dépendances du module") donne un aperçu de ceci :

Un module est une collection de blocs de configuration et d'exécution qui sont appliqués à l'application pendant le processus d'amorçage.Dans sa forme la plus simple, le module consiste en une collecte de deux types de blocs:

Blocs de configuration - Soyez exécuté pendant les inscriptions et la phase de configuration des fournisseurs.Seuls les fournisseurs et les constantes peuvent être injectés en blocs de configuration.Il s'agit d'éviter l'instanciation accidentelle des services avant d'avoir été entièrement configurée.

Exécuter des blocs - Soyez exécuté après la création de l'injecteur et utilisé pour lancer l'application.Seules les instances et les constantes peuvent être injectées dans des blocs d'exécution.Il s'agit d'empêcher une autre configuration système pendant le temps d'exécution de l'application.

Compte tenu de ce qui précède, vous ne pouvez injecter que des constantes et des fournisseurs (marqués du Provider suffixe dans la documentation de l'API).Cela répond probablement à votre question mais n'aide pas à résoudre votre problème de chargement des modèles...

Je me demande si vous ne pourriez pas simplement utiliser la balise de base en HTML, puis simplement utiliser des chemins relatifs (vers la base) sans spécifier de chemins absolus ?Quelque chose comme (à condition que la base soit correctement configurée) :

$routeProvider.when('/alert', {
  controller: function () { },
  templateUrl: 'partials/instances.html'
});

Answer 2

Bien que la question ait été répondue généralement, voici un peu d'addition ciblant l'exemple concret utilisé dans la question suivante:

Comment utiliser une constante angulaire pour définir la baseurl de vos partiels (ou pour définir d'autres constantes représentant les valeurs du serveur et les rendre disponibles pour la configuration):

// file: app.js
'use strict';

/* App Module */
angular.module( 'myApp', [] )

  // define the templateBaseUrl
  .constant( 'templateBaseUrl', 'themes/angular/partials/' );

  // use it in configuration
  .config(['$routeProvider','templateBaseUrl', function($routeProvider,templateBaseUrl) {
    $routeProvider
      .when( '/posts', {
        templateUrl : templateBaseUrl + 'post-list.html',
        controller  : PostListCtrl
      })
      .when( '/posts/:postId-:slug', {
        templateUrl : templateBaseUrl + 'post-view.html',
        controller  : PostViewCtrl
      })
      .when( '/about', {
        templateUrl : templateBaseUrl + 'about.html',
        controller  : AboutPageCtrl
      })
      .when( '/contact', {
        templateUrl : templateBaseUrl + 'contact.html',
        controller  : ContactPageCtrl
      })
      .otherwise({
        redirectTo: '/posts'
      })
    ;
  }]);

À mon avis, cela a plusieurs avantages:

• Si vous déplacez vos points de vue, il vous suffit de mettre à jour votre code dans un seul emplacement
• Si vos partiels sont profondément imbriqués dans la mise en page de votre projet, "templatebaseurl" ne provoque pas autant de bruit que tout le chemin serait
• vous pouvez même changer entre le chemin relatif et absolu
• Une réponse à une question similaire suggère l'utilisation de l'élément de base de HTML Pour supprimer le besoin de préparer une baseurl à chaque template. Mais cela a également affecté toutes les autres ressources sur le site Web. Configuration uniquement L'URL de base des modèles n'a aucun effet secondaire

  Généralement, je n'utilise pas cette solution avec une valeur codée dure comme ci-dessus. Ce n'est qu'un exemple de montrer quoi faire de la manière la plus simple. Pour pouvoir copier votre application sur votre serveur, définissez la valeur en dehors de l'App.js, dans votre fichier d'index et générer le côté des chemins de pathes nécessaires:

  // file: index.php
  <?php
    // only depends on your project layout
    $angularPartialsBaseUrl = 'themes/angular/partials/';
    // this will change when you move the app around on the server
    $themeBaseUrl  = $_SERVER['REQUEST_URI'] . 'themes/angular';
  ?><!DOCTYPE html>
  <html ng-app="myApp">
  <head>
      <title>Yii Blog Demo</title>
  
      <script>
        var myNS = myNS || {};
        myNS.appConfig = myNS.appConfig || {};
        myNS.appConfig.templateBaseUrl = '<?php echo $angularPartialsBaseUrl; ?>';
      </script>
  
      <script src="<?php echo $themeBaseUrl; ?>/js/vendor/angular/angular.js"></script>
      <script src="<?php echo $themeBaseUrl; ?>/js/app.js"></script>
  
  </head>
  
  [...]
  

  et dans App.js:

  // file: app.js
  'use strict';
  
  /* App Module */
  angular.module( 'myApp', [] )
  
    // define the templateBaseUrl using external appConfig
    .constant( 'templateBaseUrl', myNS.appConfig.templateBaseUrl );