Why shouldn't I access the factory function through a provider.$get in the config phase?

Question

First of all, this is an honest question. And I'm looking for honest and justified answers on why I shouldn't be doing this...

angular
    .module('X', ['Y'])
    .config(function (myFactoryProvider, myServiceProvider) {
        myFactoryProvider.$get().myFn();
        myServiceProvider.$get().myFn();
    });

angular
    .module('Y', [])
    .factory('myFactory', ['$location', function ($location) {
        return {
            myFn: function () {
                console.log('factory');
                console.log($location.absUrl());
            }
        }
    }])
    .service('myService', ['$location', function ($location) {
        this.myFn = function () {
            console.log('service');
            console.log($location.absUrl());
        }
    }]);

Here's a JSFiddle: http://jsfiddle.net/1vetnu6o/

This is working as you can see above and it solves a few problems for me. But I shouldn't probably be doing this and I want to understand why. I really need good reasons to not do this. Despite the fact that I really want to.

tl;dr;

Here's the context of the problem...

I have this internal framework used by multiple products where there's this one service (which happens to be a factory) that basically contains a group of related helper methods. In this case device related like isMobileDevice, isAndroid, getDeviceType (with returns mobile, tablet or desktop), and few others...

This service must be injected into the config() phase of the application using the framework because we need access to the getDeviceType function. The thing is, we need to get the deviceType to load proper templates with $routeProvider. It's in the config() phase that we are building the correct template paths to be used for all the routes. Some of them depend on the deviceType, while others have a generic template independent of the device.

Since this is a service, we cannot inject it directly into the config() phase but we can call that method using the technique I mentioned earlier in the post.

How I'm currently solving this? The helper service is actually a provider and all the methods are exposed both in the provider section as well as in the factory function. Not ideal, but it works. I consider this a work-around, but I'd rather have a work-around in the application and not the framework, thus the technique first mentioned.

Thoughts?

Answer 1

I didn't knew but actually you can invoke on config phase. The problem is that myService will be instantiated twice :/

 angular
    .module('X', [])
    .config(function(myServiceProvider) {
      myServiceProvider.$get().myFn();
    })
    .run(function(myService) {
      myService.myFn();
    })
    .service('myService', ['$location', function($location) {
      console.log('myService!');
      this.myFn = function() {
        console.log($location.absUrl());
      }
    }]);

output:

  "myService!"
  "location"
  "myService!"
  "location"

This is dangerous if you call $get on config of a service that has a big nested dependency tree :/

Answer 2

I think the correct approach, if you need a utility service (with no dependency), is to use a constant (in this way you can inject it everywhere). Otherwise if you need dependencies use a service and stick to the run() block.

The config() block it's the place to instruct your services how they should work with the help of their providers.

The run() block it's the perfect place to do some logic when your app starts (aka main method).