title: Interceptor.intercept Is Not A Function
body: <p>I've been trying to implement an application-wide interceptor, however, I keep seeing the following error:</p>
  
  <pre><code>TypeError: this.interceptor.intercept is not a function
  </code></pre>
  
  <p>After much debugging, I realized the reason why it's happening is because I have a service that is being called from a child component. When I use the custom interceptor from the app.component, everything works fine, but if I use it from a child component, I get that error. I am at a loss. Here is a code sample. I set it up in mostly the same way my app is set up:</p>
  
  <p><a href="https://angular-rbbkvv.stackblitz.io/test/index" rel="nofollow noreferrer">https://angular-rbbkvv.stackblitz.io/test/index</a> (there's no validation; no POST is made so data is collected)</p>
  
  <p>As you can see, I am displaying the error, which is the error posted above. On top of that, if you follow the network tab, you will not see the POST being made.</p>
  
  <p>I have spent days on this issue, and I'm at a loss. I really hope I am doing something very simple wrong.</p>
  
  <p>I greatly appreciate your help!</p>