title: inject $route into a http interceptor
body: <p>I am trying to inject custom header to every API request. When I am providing some hard coded text it works.</p>
  
  <p><strong>Working code</strong></p>
  
  <pre><code>myApp.config(['$httpProvider', function ($httpProvider) {
      var requestInterceptor = ['$q', '$rootScope', 
          function ($q, $rootScope) {
              var interceptorInstance = {
                  request: function (config) {
                      config.headers['X-MyApp-CustomHeader'] = "foobar"; 
                      return config || $q.when(config);
                  }
              };
              return interceptorInstance;
          }];
  
      $httpProvider.interceptors.push(requestInterceptor);
  }]);
  </code></pre>
  
  <p><strong>Not working code</strong></p>
  
  <pre><code>myApp.config(['$httpProvider', function ($httpProvider) {
      var requestInterceptor = ['$q', '$rootScope', '$route',
          function ($q, $rootScope, $route ) {
              var interceptorInstance = {
                  request: function (config) {
                      config.headers['X-MyApp-CustomHeader'] = $route.current.params.CustomParameter; 
                      return config || $q.when(config);
                  }
              };
              return interceptorInstance;
          }];
  
      $httpProvider.interceptors.push(requestInterceptor);
  }]);
  </code></pre>
  
  <p><strong>Error</strong>, When trying to inject <code>$route</code></p>
  
  <blockquote>
    <p>Uncaught Error: [$injector:cdep] Circular dependency found: $route &lt;- $http
    <a href="http://errors.angularjs.org/1.2.3/" rel="nofollow noreferrer">http://errors.angularjs.org/1.2.3/</a>$injector/cdep?p0=%24route%20%3C-%20%24http </p>
  </blockquote>