title: Angular: Extending Services and Passing Parameters
body: <p>I'm having a hard time understanding how to extend services in Angular. </p>
  
  <p>I have a service that connects to Firebase and does all sorts of common tasks (get, set, update, list, etc.) and instead of re-writing it for my special components I tried just extending it. </p>
  
  <p>The idea was I could pass just the new part of the path but that throws an error: </p>
  
  <pre><code>Cannot resolve all parameters for 'FirebaseService'(?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that 'FirebaseService' is decorated with Injectable.
  </code></pre>
  
  <p>The issue is in the constructor and my lack of OOP brains. I can pass other services or providers into my service but I can no longer pass simple string parameters unless I'm missing something. I tried setting properties but I don't think I'm getting the context right.</p>
  
  <p>I was thinking it was an issue with the @Injectable but I'm not sure. </p>
  
  <p>Here's a simplified version of what I tried first:</p>
  
  <p><strong>UPDATED TO INCLUDE PLUNKER LINKS:</strong></p>
  
  <p><a href="http://plnkr.co/edit/6cXqsD9M1O19BjThv61p?p=preview" rel="nofollow noreferrer">Plunker for passing with parameters</a></p>
  
  <p><a href="http://plnkr.co/edit/7UtV4VEEpR02xIsBqnGR?p=preview" rel="nofollow noreferrer">Plunker for passing with constructor</a></p>
  
  <pre><code>@Injectable()
  export class FirebaseService {
    rootPath:string = "https://mysite.firebase.com/";
    childPath:string;
    pathToUse: string;
    constructor() {
      if(this.childPath){
          this.pathToUse = this.rootPath + this.childPath;
      }else{
          this.pathToUse = this.rootPath;
      }
      console.log(this.pathToUse);
    }
  }
  //The in project_service.ts
  @Injectable()
  export class ProjectService extends FirebaseService{
      childPath:string = "projects";
      constructor(){
          super();
      }
  }
  </code></pre>
  
  <p>I expected it to have the "projects" line attached. It doesn't, it just repeats. </p>
  
  <p>So Then I tried passing through the constructor:
  </p>
  
  <pre><code>@Injectable()
  export class FirebaseService {
    rootPath:string = "https://mysite.firebase.com";
    pathToUse: string;
    constructor(childPath:string) {
      if(childPath){
          this.pathToUse = this.rootPath + childPath;
      }else{
          this.pathToUse = this.rootPath;
      }
      console.log(this.pathToUse);
    }
  }
  //The in project_service.ts
  @Injectable()
  export class ProjectService extends FirebaseService{
      constructor(){
          super('projects');
      }
  }
  </code></pre>
  
  <p>Which just blows everything up. I have a way around it but it seems like a total hack. </p>
  
  <p>What is the correct way to pass the "projects" parameter to the parent class?</p>