title: Dependency errors in Angular when creating an $http interceptor as a standalone module
body: <p>Here is a working example of how I have set up an interceptor which attaches an authentication token to each request (this is more or less the example from <a href="https://docs.angularjs.org/api/ng/service/">https://docs.angularjs.org/api/ng/service/</a>$http)</p>
  
  <pre><code>angular.module("app", [])
  .config(function ($httpProvider) {
    $httpProvider.interceptors.push("authInterceptor");
  })
  .factory("authInterceptor", function ($q) {
    return {
    // interceptor configuration here
    }
  })
  </code></pre>
  
  <p>I have a lot of other stuff in my <code>config</code> and <code>run</code> blocks which call and initiate services from different angular modules, so I want to tidy things up a bit. However I understand there are some very specific rules to dependency injection in <code>config</code> blocks, which I don't quite understand, and these are preventing me from defining my <code>authInterceptor</code> factory in a separate module. As other logic in the <code>config</code> and <code>run</code> blocks calls other modules in the app, declaring that interceptor right there looks out of place.</p>
  
  <p>This is what I want to do:</p>
  
  <pre><code>angular.module("services.authInterceptor", [])
  .factory("authInterceptor", function ($q) {
    return {
    // interceptor configuration here
    }
  });
  
  angular.module("app", [
   "services.authInterceptor"
  ]).config(function ($httpProvider, authInterceptor) {
    $httpProvider.interceptors.push("authInterceptor");
  });
  
  // Error: Unknown provider authInterceptor.
  </code></pre>
  
  <p>I tried injecting it to the <code>run</code> block instead, but I guess you're not allowed to inject <code>$httpProvider</code> there:</p>
  
  <pre><code>angular.module("app", [
    "services.authInterceptor"
  ]).run(function ($httpProvider, authInterceptor) {
    $httpProvider.interceptors.push("authInterceptor");
  });
  
  // Error: Unknown provider: $httpProviderProvider &lt;- $httpProvider
  </code></pre>
  
  <p>Where should I inject the module so that <code>$httpProvider</code> is also injectable, and where should I add the interceptor to existing ones? My main goal is keeping the interceptor and other similar services in their own self-containing modules.</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>I get a different error which seems to be getting me closer when I declare a <code>provider</code> instead of <code>factory</code> (for some reason I always thought these were interchangeable):</p>
  
  <pre><code>angular.module("services.authInterceptor")
  .provider("authInterceptor", function ($q) {
    return {}
  })
  
  // Error: Unknown provider: $q
  </code></pre>
  
  <p>So it now successfully injects <code>authInterceptor</code> to my <code>config</code> block, but fails when trying to find <code>$q</code>.</p>