Configuring a service that depends on another service angularjs

Question

What I need to know is how can I use a service like $http outside of the $get function or is it even possible? My code goes and loads a json file that provides a dictionary that my application makes use of in various ways. I want users to be able to customize this dictionary so I'm using jquery's extend method to allow users to add values to an object and extend the dictionary. The instantiate method in the code below handles all of this. What I'd like to be able to do is configure my service like so

config(['_sys_dictionaryProvider', function(_sys_dictionaryProvider) {
    _sys_dictionaryProvider.instansiate('config/dictionary/custom/dictionary.json');
}])

But this requires the $http service to be available at the time of configuration and I don't think it is. If I put the $http service as part of the $get property it will work, as explained here, except then the network has to be queried every time the service is used. Is there any way to use a service in the configuration of another service?

Full code below, let me know if I need to clarify.

app.provider("_sys_dictionary", ['$http',
    function ($http) {
        var dictionary,
            DictionaryService = function () {
                this.definitions = dictionary;
                this.define = function (what) {
                    var definitions = this.definitions;
                    if (what instanceof Array) {
                        for (var i = 0; i < what.length; i++) {
                            definitions = definitions[what[i]];
                        }
                        return definitions;
                    }
                    return this.definitions[what];
                };
            };
        return {
            $get: function () {
                return new DictionaryService();
            },
            instansiate: function (path) {
                $http.get('config/dictionary/dictionary.json').success(function (data) {
                    dictionary = data;
                    $http.get(path).success(function (data) {
                        jQuery.extend(true, dictionary, data)
                    });
                });
            }
        };
    }
]);

score 0 · Answer 1 · answered Sep 11 '14 at 21:30

Seeing as I don't believe it is possible to use a service in the configuration stage, since there is no way to guarantee that the service your using itself has been configured, I went this route instead

app.provider("_sys_dictionary", function () {
    var dictionary,
        DictionaryService = function () {
            this.definitions = dictionary;
            this.define = function (what) {
                var definitions = this.definitions;
                if (what instanceof Array) {
                    for (var i = 0; i < what.length; i++) {
                        definitions = definitions[what[i]];
                    }
                    return definitions;
                }
                return this.definitions[what];
            };
        };
    return {
        $get: [

            function () {
                console.log(dictionary);
                return new DictionaryService();
            }
        ],
        instansiate: function (path) {
            jQuery.ajax({
                url: 'config/dictionary/dictionary.json',
                success: function (data) {
                    dictionary = data;
                    jQuery.ajax({
                        url: path,
                        success: function (data) {
                            jQuery.extend(true, dictionary, data);
                        },
                        async: false
                    });
                },
                async: false
            });
        }
    };
});

I ended up using jquery's ajax object and turned async to false since I need the dictionary to be ready before the service gets used. Hope this helps someone. If anyone knows a better way of doing this I'd love to know.

Configuring a service that depends on another service angularjs

1 Answers1