title: Angular2 no provider for service error
body: <p>From <a href="https://stackoverflow.com/questions/35206821/angular2-access-global-service-without-including-it-in-every-constructor">Angular2 access global service without including it in every constructor</a> I have grabbed the code and slightly modified it into:</p>
  
  <pre><code>@Injectable()
  export class ApiService {
    constructor(public http: Http) {}
  
    get(url: string) {
      return http.get(url);
    }
  
  }
  
  @Injectable()
  export abstract class BaseService {
    constructor(protected serv: ApiService) {}  
  }
  
  @Injectable()
  export class MediaService extends BaseService {
  
    // Why do we need this?
    constructor(s: ApiService) {
      super(s)
    }
  
    makeCall() {
      this.serv.get("http://www.example.com/get_data")
    }
  
  }
  </code></pre>
  
  <p>However, when I try to run this code I get an error in the console:</p>
  
  <blockquote>
    <p>NoProviderError {message: "No provider for ApiService! (App ->
    MediaService -> ApiService)", stack: "Error: DI Exception↵</p>
  </blockquote>
  
  <p>I have created a Plunkr with the code at <a href="https://plnkr.co/edit/We2k9PDsYMVQWguMhhGl" rel="noreferrer">https://plnkr.co/edit/We2k9PDsYMVQWguMhhGl</a></p>
  
  <p>Does anyone know what causes this  error?</p>