angular2 extend service with argument in constructor

Question

I have some problems in understanding how to extend correctly a service in angular2, maybe because I don't understand well how to extend a class in typescript.

SuperClass

@Injectable()
export class CallService{
    constructor(private errror:string){
        this.errMsg=errror;
    }
    private _errMsg:string;
    set errMsg(arg0:string){
        this._errMsg=arg0;
    }
    get errMsg():string{
        return this._errMsg;
    }
}

SubClass

@Injectable()
export class DownloadService extends CallService{
    constructor(private error:string,private http:Http){
        super(error)
    }
}

App.Component

@Component({
selector:'my-app',
    templateUrl:'app/app.component.html',
    styleUrls:['app/app.component.css'],
    directives:[ROUTER_DIRECTIVES,WaitComponent],
    providers:[DownloadService,SwitcherService,CallService,WaitService]
})
export class AppComponent{
    title:'App'
    constructor(
        private areadownloadservice:AreaDownloadService,
        private waitService:WaitService,
        private switcherservice:SwitcherService,
        private callService:CallService){}
    )
}

What I want to do is to extend some classes with CallService so that all class that make a calls will have a errMsg string property to set or get, but I get this exception:

No provider for String!

What did I missed?

The problem is not a subclass. string type annotation in constructor makes the injector to look for string provider, and there is none, and there is also no provider defined for error in the component. — Estus Flask
– Estus Flask, Commented Aug 9, 2016 at 14:20
ok, and what's the right way to extend a service in the way that I write above? — mautrok
– mautrok, Commented Aug 9, 2016 at 14:22
What do you want Angular DI to pass in to the error parameter? — Günter Zöchbauer
– Günter Zöchbauer, Commented Aug 9, 2016 at 14:27

Günter Zöchbauer · Accepted Answer · 2016-08-09 14:30:40Z

5

You can either

remove the error parameter
make the error parameter optional

export class CallService{
    constructor(@Optional() private errror:string){

...

export class DownloadService extends CallService{
    constructor(@Optional() private error:string,private http:Http){

or tell DI what it should pass

bootstrap(AppComponent, [HTTP_PROVIDERS, {provide: 'someToken', useValue: 'someStringValue'}])

export class CallService{
    constructor(@Inject('someToken') private errror:string){

...

export class DownloadService extends CallService{
    constructor(@Inject('someToken') private error:string,private http:Http){

You can also use an OpaqueToken instead of the string key ('someToken').
See also http://blog.thoughtram.io/angular/2016/05/23/opaque-tokens-in-angular-2.html

answered Aug 9, 2016 at 14:30

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ervis Trupja · Accepted Answer · 2016-08-09 14:25:06Z

2

At this line of code constructor(private error:string,private http:Http){ you are telling the constructor to actually prepare for the Http and string services, but you do not have such a string Service declared anywhere.

answered Aug 9, 2016 at 14:25

Ervis Trupja

2,8307 gold badges24 silver badges43 bronze badges

1 Comment

mautrok Over a year ago

it is a good answer too, it explain the error really well, but Gunter written a more complete solution

Collectives™ on Stack Overflow

angular2 extend service with argument in constructor

SuperClass

SubClass

App.Component

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

SuperClass

SubClass

App.Component

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related