webentwicklung-frage-antwort-db.com.de

Injizieren Sie eine Konstante in die Konfiguration anderer Module mit Angular JS

Ich möchte einige Variablen wie Basispfade in meiner Anwendung freigeben. Diese Variablen müssen während der Modulkonfiguration zugänglich sein. Ich war der Meinung, dass ich dafür eine Konstante oder einen Provider verwenden kann.

Ich habe mehrere Module und jedes hat seine eigene Routing-Konfiguration. In diesen Routing-Konfigurationen möchte ich beispielsweise auf einige Einstellungen zugreifen.

Dies funktioniert für die App-Modul-Konfiguration, aber nicht für andere Modul-Konfigurationen (für Controller auf anderen Modulen). Ich erhalte immer "Unknown provider: info from myApp.orders".

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

myApp.constant('info', {
  version : '1.0'
});

myApp.config(function(info) {
  console.log('app config: ' + info.version);
});

myApp.controller('MyController', function (info) {
  console.log('controller: ' + info.version);
});

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

// Remove comments to see it fail.

//orders.config(function(info) {
//  console.log('orders config: ' + info.version);
//});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

  <div ng-app="myApp" class="container" ng-controller="MyController">        
  </div>

Ich glaube, ich habe gerade ein kleines Detail übersehen. Hast du eine Idee?

36
martinoss

Ihre info Konstante ist in Ihrem myApp Modul definiert. Wenn ich Ihre Frage richtig verstehe, möchten Sie die Konstanten in anderen Modulen (z. B. Modul myApp.orders) verwenden. Wenn ja, müssen Sie myApp in myApp.orders einfügen, aber es sieht so aus, als wollten Sie das Gegenteil tun. Eine Lösung besteht darin, die Konstanten in ein eigenständiges Modul zu entkoppeln und bei Bedarf als Abhängigkeit einzufügen.

angular.module('constants', []) 
  .constant(...);

angular.module('myApp', ['constants', 'myApp.orders'])
  ...

angular.module('myApp.orders', ['constants'])
  ...
51
ikumen

Ich weiß nicht, ob meine Lösung die schönste ist, aber ich habe in meine index.html eine Definition einer KONFIG eingefügt, auf die ich von anderen Komponenten aus verweise. Ich generiere meine index.html mit serverseitigem Code, damit ich die Werte festlegen kann, wenn das Programm gestartet wird. Das heißt, ich benutze index.cshtml, aber es ist genauso einfach index.php oder eine andere Technologie. So sieht meine index.html aus:

....

 <script type="text/javascript">
    var usingMockDataGlobal = true;
 </script>

....


<script type="text/javascript">

        (function () {
            'use strict';

            var configData = {


                codeCampType: 'angu',

                loggedInUsername: 'peter',
                mockData: usingMockDataGlobal
            };
            angular.module('baseApp').constant('CONFIG', configData);


        })();
    </script>
3
Peter Kellner