Jak mogę użyć $ http w stałej deklacji - angularjs

Wyjaśnienie problemu: Tak więc w obecnej aplikacji mamy kilkaciągłe deklaracje konfiguracji, które łączą aplikację ze środowiskiem produkcyjnym lub programistycznym, i komentujemy je za każdym razem, gdy chcemy przełączyć, co nie wydaje mi się idealnym scenariuszem. Więc po to, miałem konfiguracyjny zewnętrzny plik json, który zawiera wartości i umieść ten plik osobno od zmieniającego się kodu i stamtąd pobierz wartości do mojej stałej.

Rzeczywiste pytanie: W tym fragmencie kodu:

application.constant("servicesConfig", (function() {
var con = "appdev";
//var con = "appprod";
return {
host: con+".appdomain.com"
}
}

Jak widać, muszę ręcznie zmodyfikować zmienną „con”, aby przełączać się między środowiskami deweloperów i prodów. Zamiast tego chcę wykonać następujące czynności:

application.constant("servicesConfig", (function() {
var deferred = $q.defer();
var configLocation = "config/server.json";
var configurations = $http.get(configLocation)
return {
host: configurations.con+".appdomain.com"
}
}

Moje pytanie brzmi: jak mogę wstrzyknąć $ http lub inne usługi kątowe?

Odpowiedzi:

Możesz ręcznie uruchomić kątowy po otrzymaniu danych z serwera.

Przykład na jsfiddle:

var app = angular.module("myApp", []);
app.controller("myController", function($scope, servicesConfig) {
console.log(servicesConfig);
$scope.model = servicesConfig.host;
$scope.reset = function() {
$scope.model = "";
};
});

angular.element(document).ready(function() {
//Simulate AJAX call to server
setTimeout(function() {
app.constant("servicesConfig", {
host: "appdev"
});
angular.bootstrap(document, ["myApp"]);
}, 2000);

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-cloak>
<div ng-controller="myController">
<input type="text" ng-model="model" /> {{model}}
<button ng-click="reset()">Reset</button>
</div>
</div>