Why injecting `$http` in angular 1 error interceptor cause circular dependency?
<p>Consider the following interceptor template for angular 1</p>

<pre><code>    (function () {
        'use strict';

        angular
            .module('myApp')
            .factory('apiError', apiError);

        apiError.$inject = [
            '$q',
            '$injector',
            '$http'];

        function apiError($q,
                          $injector,
                          $http) {

        }
    })();
</code></pre>

<p>Injecting <code>$q</code> and <code>$injector</code> will not encounter any problem, but injecting <code>$http</code> will cause circular dependency error.</p>

<pre><code>Error: $injector:cdep
Circular Dependency
</code></pre>

<p>The fix I made is simply setting <code>$http</code> using <code>$injector</code> inline</p>

<pre><code> var $http = $injector.get('$http');
</code></pre>

<p>But I have two questions</p>

<ol>
<li>Why is there circular dependency?</li>
<li>How did <code>$injector</code> solved the circular dependency</li>
</ol>