AngularJS - Abrufen von Modulkonstanten von einem Controller


72

Ich versuche, ein myApp.config-Modul zu erstellen, um einige Einstellungen für meine App zu speichern. Ich habe eine config.js-Datei geschrieben:

angular.module('myApp.config', [])
    .constant('APP_NAME','My Angular App!')
    .constant('APP_VERSION','0.3');

Ich habe es meiner app.js (eckiger Samen) hinzugefügt:

angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives', 'myApp.controllers', 'myApp.config']).

Ich habe es der Datei index.html hinzugefügt und jetzt versuche ich herauszufinden, wie ich es in meine Controller bekomme. Ich habe versucht:

angular.module('myApp.controllers', ['myApp.config'])
  .controller('ListCtrl', ['$scope', 'myApp.config', function($scope, $config) {
    $scope.printme = $config;
  }])

aber ich bekomme:

Unbekannter Anbieter: myApp.configProvider <- myApp.config

Ich mache hier wahrscheinlich etwas falsch, irgendwelche Ideen?


Außerdem haben Sie versucht, ein Modul als Abhängigkeit in einen Controller einzufügen, was nicht funktioniert. Ein Modul kann nur eine Abhängigkeit eines anderen Moduls sein.
Shivam

Antworten:


88

Ich denke nicht, dass es gültig ist, den Modulnamen in einer solchen Injektion zu verwenden. Sie können die Konstanten jedoch einfach nach Namen einfügen:

angular.module('myApp.controllers', ['myApp.config'])
  .controller('ListCtrl', ['$scope', 'APP_NAME', function($scope, appName) {
     $scope.printme = appName;
}]);

4
Richtig, es gibt einen globalen Abhängigkeitsinjektionsbereich. Sobald Sie einen .constantin einem Modul eingerichtet haben, können Sie den Wert an einer anderen Stelle injizieren.
Jpsimons

6
Ist es im Allgemeinen sinnvoll, eine Konfigurationsdatei (für anpassbare Einstellungen) in Angular zu haben?
Asaf

@Asaf können Sie mit dem folgenden .constant-Dienst gehen. angular.module('app').constant('appSettings', { version: '1.0', appName: 'myApp'});Dann injizieren Sie es in einen Controller oder .config oder was auch immer Sie wollenangular.module('app').controller('simpleCtrl', ['appSettings', function(appSettings) { $scope.valueInIsolatedScope = appSettings.version; }])
hastrb

73

Ich denke, der einfachste Ansatz besteht darin, eine Konstante mithilfe eines Objektliteral hinzuzufügen. Dies passt meiner Meinung nach zu den meisten Anwendungsfällen für die Anwendungskonfiguration, da es ein komplexes Konfigurationsobjekt unterstützt. Der constantSchritt wird auch frühzeitig ausgeführt, bevor andere Anbieter registriert werden.

angular.module('myApp').constant('cfg', {
  url: 'https://myapi.com/v1/',
  httpTimeout: 5000
})

Um es zu benutzen, spritzen Sie einfach cfg:

angular.module('myApp').factory('user', function(cfg, $http){
  // cfg and $http together at last
})

Genau das, wonach ich gesucht habe!
Devner

Ich habe einen konstanten Anbieter mit den für die Navigation verwendeten Schlüsselcodes und möchte den konstanten Anbieter in die Steuerung einspeisen (ich möchte vermeiden, dass jeder Eintrag separat eingefügt wird). Ist das möglich? Ich habe bereits einige andere Dienste injiziert.
Owczarek

Ist es schwieriger als: angular.module('myApp').constant('keyCodes', { left: 36, right: 38 })'und : angular.module('myApp').factory('myComponent', function(keyCodes) { keyCodes.left })?
SimplGy

5

Es sollte auch beachtet werden, dass die Lösung von SimplGy bedeutet, dass das 'cfg'-Objekt eine Konstante ist, die Eigenschaften dieses Objekts jedoch nicht. Dies bedeutet, dass Sie 'cfg' nicht wie folgt neu zuweisen können:

cfg = { randomProperty: randomValue };

Sie können die Eigenschaften des 'cfg'-Objekts wie folgt neu zuweisen:

cfg.url = 'BrandNewURL.com';
cfg.httpTimeout = 30;

1
Dies beantwortet die Frage nicht. Antworten auf andere Antworten sollten als Kommentare geschrieben werden.
Ken Wayne VanderLinde

1
@ KenWayneVanderLinde Entschuldigung Ken. Leider habe ich noch nicht genügend Vertreter gesammelt, um Kommentare abzugeben, aber ich fand es wichtig, dass der Autor sich der Probleme bewusst ist, die bei der Verwendung von Angulars 'Constant' auftreten können.
Matt M

1
@ MattM Ich denke du bist in Ordnung. All das in einen Kommentar zu setzen, wäre unmöglich gewesen.
Karmenismus

3

Überprüfen Sie die Verwendung von Konstanten in diesem Beispiel:

angular
.module('abp001App', ['ngRoute'])
.constant("myConfig", {
    "url": "http://localhost",
    "port": "80"
})
.config(function ($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'views/main.html',
            controller: 'MainCtrl'
        })
        .otherwise({
            redirectTo: '/'
        });
})
.controller('MainCtrl', function (myConfig) {
    // Do something with myConfig...
});
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.