2014-12-31 4 views
10

Ich baue eine Anwendung, die CORS-Anfragen verwendet. Jede Anfrage i verwenden Host-Adresse von einem konstantenWie ist es möglich, einige Einstellungen aus der .json-Datei zu laden, bevor die eckige App startet

angular.module('siteApp').constant('baseUrl', { 
'server':'htttp://localhost/', 
}) 

bekommen Und in jedem Service, den ich verwenden Anfrage wie folgt an:

angular.module('siteApp').factory('DocsSvc', function ($http, baseUrl) { 
    var baseurl = baseUrl.server ; 
    $http.get(baseurl + 'document') 

Ist es möglich zu machen 'htttp: // localhost /' Wert - kam aus der Datei config.json in baseUrl constant oder baseUrl factory? ich meine: wie kann ich etwas von Ajax-Request laden ein, es zu App-Module

Ich habe versucht, zugänglich machen: von baseUrl

.run(['$rootScope', , function ($rootScope) { 

    $.ajax('config.json', {async: false}) 
    .success(function (data) { 
    $rootScope.HOST = data.HOST; 
    }); 

Und versucht, darauf zuzugreifen:

angular.module('siteApp').factory('baseUrl',function($rootScope) { 
return { 
    server: $rootScope.HOST 

Aber kein Glück - die BaseUrl.server kommt undefiniert in Funktionen

Antwort

7

Sie können run Methode der Winkel verwenden.

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

    app.run(function($http, $rootScope){ 
    $http.get('config.json') 
    .success(function(data, status, headers, config) { 
    $rootScope.config = data; 
    $rootScope.$broadcast('config-loaded'); 
    }) 
    .error(function(data, status, headers, config) { 
    // log error 
    alert('error'); 
    }); 
}) 

app.controller('MainCtrl', function($scope, $rootScope) { 
    $scope.$on('config-loaded', function(){ 
    $scope.name = $rootScope.config.name; 
    }); 
}); 

sehen diese plunker

+0

Bitte schauen Sie in die aktualisierte Frage: Ich hatte versucht, so etwas zu tun, aber ohne Erfolg – happyZZR1400

+0

Siehe die aktualisierte Antwort und Plumer. es funktioniert :) – vinesh

+1

Sie müssen das config-loaded-Ereignis nur für Controller abhören, die zu Beginn geladen werden. Denn in diesem Fall wird der Controller aufgerufen, bevor die JSON-Datei geladen wird. – vinesh

1

Wenn Sie es noch vor den Winkel app beginnt tun möchten, können Sie stattdessen die ng-App-Richtlinie zu verwenden, die Bootstrap-Funktion verwenden.

Von: https://docs.angularjs.org/api/ng/function/angular.bootstrap

<!doctype html> 
<html> 
<body> 
<div ng-controller="WelcomeController"> 
    {{greeting}} 
</div> 

<script src="angular.js"></script> 
<script> 
    var app = angular.module('demo', []) 
    .controller('WelcomeController', function($scope) { 
     $scope.greeting = 'Welcome!'; 
    }); 
    // Do your loading of JSON here 
    angular.bootstrap(document, ['demo']); 
</script> 
</body> 
</html> 
1

müssen Sie über Datenänderung Winkel sagen, so ändern Sie den Code in etwa so:

.run(['$rootScope', function ($rootScope) { 

    $.ajax('config.json', {async: false}) 
    .success(function (data) { 
    $rootScope.HOST = data.HOST; 
    $rootScope.$apply();   // New line 
    }); 
}]) 

Die $apply() seit seinem einem nicht-Winkel asynchron benötigt wird Anruf.

Verwandte Themen