Конфигурация загрузки AngularJS при запуске приложения

Мне нужно загрузить файл конфигурации (формат JSON) при запуске приложения AngularJS, чтобы загрузить несколько параметров, которые будут использоваться во всех вызовах api. Поэтому мне было интересно, можно ли это сделать в AngularJS, и если да, где/когда я загружу конфигурационный файл?

Примечание: - Мне нужно будет сохранить параметры файла конфигурации в службе, поэтому мне нужно будет загрузить содержимое json файла до загрузки любого контроллера, но с доступными сервисными единицами - Использование внешнего json файла является обязательным в моем случае здесь, так как клиент приложения должен иметь возможность легко обновлять конфигурацию приложения из внешнего файла без необходимости проходить через источники приложений.

Ответ 1

EDITED

Похоже, что вы пытаетесь настроить службу с параметрами. Чтобы загружать внешний файл конфигурации асинхронно, вам придется загружать приложение angular самостоятельно внутри полного обратного вызова загрузки данных, вместо использования автоматической развертки.

Рассмотрим этот пример для определения службы, на самом деле не имеющего URL-адреса службы (это будет что-то вроде contact-service.js):

angular.module('myApp').provider('contactsService', function () {

    var options = {
        svcUrl: null,
        apiKey: null,
    };

    this.config = function (opt) {
        angular.extend(options, opt);
    };

    this.$get = ['$http', function ($http) {

        if(!options.svcUrl || !options.apiKey) {
            throw new Error('Service URL and API Key must be configured.');
        }

        function onContactsLoadComplete(data) {
            svc.contacts = data.contacts;
            svc.isAdmin = data.isAdmin || false;
        }

        var svc =  {
            isAdmin: false,
            contacts: null,
            loadData: function () {
                return $http.get(options.svcUrl).success(onContactsLoadComplete);
            }
        };

        return svc;
    }];
});

Затем, когда документ готов, вы должны сделать вызов для загрузки вашего файла конфигурации (в этом случае, используя jQuery). В обратном вызове вы затем выполнили свой angular app.config с использованием загруженных json-данных. После запуска .config вы вручную загрузите приложение вручную. Очень важно: не используйте директиву ng-app, если вы используете этот метод, или angular будет загружать себя. Подробнее см. этот url:

http://docs.angularjs.org/guide/bootstrap

Так же:

angular.element(document).ready(function () {
    $.get('/js/config/myconfig.json', function (data) {

        angular.module('myApp').config(['contactsServiceProvider', function (contactsServiceProvider) {
            contactsServiceProvider.config({
                svcUrl: data.svcUrl,
                apiKey: data.apiKey
            });
        }]);

        angular.bootstrap(document, ['myApp']);
    });
});

UPDATE: Вот пример JSFiddle: http://jsfiddle.net/e8tEX/

Ответ 2

Я не мог заставить этот подход предложить моему Киту Моррису работать.

Итак, я создал файл config.js и включил его в index.html перед всеми файлами angular

config.js

var configData = {
    url:"http://api.mydomain-staging.com",
    foo:"bar"
}

index.html

...
<script type="text/javascript" src="config.js"></script>
<!-- compiled JavaScript --><% scripts.forEach( function ( file ) { %>
<script type="text/javascript" src="<%= file %>"></script><% }); %>

то в моей функции запуска я установил переменные config в $rootScope

.run( function run($rootScope) {
    $rootScope.url = configData.url;
    $rootScope.foo = configData.foo;
    ...
})

Ответ 3

Вы можете использовать константы для таких вещей:

angular.module('myApp', [])

// constants work
//.constant('API_BASE', 'http://localhost:3000/')
.constant('API_BASE', 'http://myapp.production.com/')
//or you can use services
.service('urls',function(productName){ this.apiUrl = API_BASE;})

//Controller calling
.controller('MainController',function($scope,urls, API_BASE) {
     $scope.api_base = urls.apiUrl; // or API_BASE
});

//в html-странице вызовите его {{Api_base}}

Есть также несколько других опций, включая .value и .config, но все они имеют свои ограничения. .config отлично, если вам нужно обратиться к провайдеру службы, чтобы выполнить некоторую начальную настройку. .value походит на константу, за исключением того, что вы можете использовать разные типы значений.

fooobar.com/info/30581/...