variable not resolve when pass through super from child class

Question

Here is my data Service class

import { BadInput } from './../common/bad-input';
import { NotFoundError } from './../common/not-found-error';
import { AppError } from './../common/app-error';
import { Http } from '@angular/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import 'rxjs/add/observable/throw';

@Injectable()
export class DataService {
 constructor(private url: string, private http: Http) { }

  getAll(obj) {
return this.http.post(this.url+"/get",obj)
  .map(response => response.json())
  .catch(this.handleError);
}
 customQuery(query) {
  console.log(this.url+"/dynamic/"+query);
return this.http.get(this.url+"/dynamic/"+query)
  .map(response => response.json())
  .catch(this.handleError);
 }
}

Am using DataService in child class here

import { Injectable } from '@angular/core';
import { DataService } from "./data.service";
import { Http } from "@angular/http";

@Injectable()
export class ReasonsService extends DataService {
  constructor(http: Http) {
  super("xxx/v1/reasons", http);
 }
}

ERROR in : Can't resolve all parameters for DataService in /tmp/build_b7eed86c18aa452fb03d88946e269f3a/toshikverma-rentitnow-df48c05/src/app/services/data.service.ts: (?, [object Object]).

Here URL which is passed from child class in not resolved

I have gone through the answers mentioned on the similar question here and here, but didn't help me, I don't know what mistake am doing here,

 "postinstall": "ng build --aot -prod",

Any help would be great thanks

try to remove `@Injectable()` from `DataService` and do not list `DataService` in the providers. IMO it's just a base class and Angular doesn't have to care about it. — hgoebl, Feb 03 '18 at 12:39
@hgoebl thanks a lot sir you saved me I was trying to resolve this from past 2 days — Toshik Verma, Feb 03 '18 at 13:07
I've added a complete answer because I think many might stumble over this. — hgoebl, Feb 04 '18 at 11:13

score 0 · Accepted Answer · answered Feb 04 '18 at 11:10

TL;DR

It's sufficient to annotate only the derivations with @Injectable and list them in providers[], not the base class.

Code

// NOTE: no @Injectable() here!
export class DataService { // might be abstract to reinforce meaning
  constructor(private url: string,
              protected http: Http) { }

  getAll(obj) { ... }
  customQuery(query) { ... }
}


@Injectable()
export class ReasonsService extends DataService {
  constructor(http: Http) {
    super("xxx/v1/reasons", http);
  }
}

Explanation

Your base class DataService is not a service instantiated and managed by Angular. It's just a base class for other services like your ReasonsService.

Because of that, your base class DataService must not have an @Injectable() annotation and should not be listed in providers.

In other words: inheriting from a base class has nothing to do with Angular, it's a TypeScript thing.

Comments

You might consider declaring your base class as abstract. Through that everybody can see that this class will not be instantiated by its own and just serves as a base class.
If you need members declared in the base class in your derivation, make them protected and not private. As an example, you can access the http service in the derivated class as well.

variable not resolve when pass through super from child class

1 Answers1

TL;DR

Code

Explanation

Comments