Search code examples
typescriptangularextending

How do I extend a class thats using direct injection


Hopefully this should be a relatively easy question for some of you out there...

I am trying to extend a component but I am not sure how to deal with the constructor method of the new component.

Below is my Base component

import { Component, OnInit }  from '@angular/core';
import { ControlsService }    from '../controls.service'

@Component({
  moduleId      : module.id,
  selector      : 'app-base',
  templateUrl   : 'base.component.html',
  styleUrls     : ['base.component.css'],
  providers     : [ControlsService]
})
export class BaseComponent implements OnInit {

  constructor(_controlService:ControlsService) {}

  ngOnInit() {

     // console.log(this._controlService.getControlByID('B5EE385D-1D6A-335A-1E94-2F857428A6FB'))  

  }

}

And Below is my new component

import { Component, OnInit }        from '@angular/core';
import { MdToolbar }                from '@angular2-material/toolbar';
import { MdIcon, MdIconRegistry}    from '@angular2-material/icon';
import { PanelComponent }           from '../panel/panel.component'
import { BaseComponent }            from '../base/base.component'
import { ControlsService }          from '../controls.service'

@Component({
  moduleId      : module.id,
  selector      : 'app-workbench',
  templateUrl   : 'workbench.component.html',
  styleUrls     : ['workbench.component.css'],
  directives    : [MdToolbar,MdIcon,PanelComponent],
  providers     : [MdIconRegistrym,ControlsService]
})
export class WorkbenchComponent extends BaseComponent implements OnInit{

  workbenchTitle = "Selection Category "

  constructor(_controlService:ControlsService) 
  {
      super(this._controlService)
  }

  ngOnInit() {



  }


}

I need my _controlService to be in the base component as this service will retrieve the controls parameters, but it seems that if I create the service in the base components constructor method, I then have to pass it into the base component from the new component. I would prefer not to do this but it seems I may have to.

The Error that is being returned to me is: (17, 21): Supplied parameters do not match any signature of call target.

Could someone point me in the right direction on how to properly extend this base component.

Thanks!


Solution

  • The this. is invalid

    export class WorkbenchComponent extends BaseComponent implements OnInit{
      constructor(_controlService:ControlsService) 
      {
          // super(this._controlService)
          // should be
          super(_controlService)
      }
    }