setup $http url from .properties file in angularjs

Question

I have some services in my App.

loginApp.factory('urlService', function() {
return {
    baseUrl : function(){
        return 'http://localhost:8080/myAppName'
        }
    }
});

consume this service by one another services.

loginApp.factory('loginServices', function($http,urlService) {
    return {
        loginAuth : function(aut,resp){
            return $http({
                method: 'GET',
                url: urlService.baseUrl()+'auth', 
            }).success(function(result) {
                   return result;
            });
        }
    }
});

I want configure http://localhost:8080/myAppName from a .properties file which is present on application root.

Answer 1

You can do some thing like this

angular.module('app.properties', []).provider('properties', function() {

    var resource;
    $.ajax({
        url: 'properties.json',
        dataType: 'json',
        async: false,
        success: function(data) {
            resource  = data;
        }
    });
    this.properties= resource;
    this.$get = function() {
        return this.properties;
    };
});

Then use this provider in you controller/services to access the properties

 angular.module('loginApp', ['app.properties']).factory('urlService', function(properties) {
return {
    baseUrl : function(){
        return properties.baseUrl;
        }
    }
});

And your properties.json should be like

{
"baseUrl" :"http://localhost:8080/myAppName"
}

NB : I have used jquery ajax to load the properties.json because it should not be an async call, so I set async: false

  $.ajax({
            url: 'properties.json',
            dataType: 'json',
            **async: false**,
            success: function(data) {
                resource  = data;
            }
        });

Answer 2

I think the best option in that case would be to create a service that then can be injected and in that service pull the config file and assign content to a returned variable (hope it makes sense so far)

Although that will leave you with possible race issues when ie your loginService will be called before config was loaded but if you make a good use of promises all this will be trivial for you