Typescript: write castable function

Question

I created a custom $http service because I wanted something more similar to the AngularJS one.

$http(config: CustomHttpConfig = this._generateHttpConfig()): Observable<any> {
    if (!config.method) {
        config.method = this.httpMethods.get;
    }
    if (!config.url) {
        console.error("Error: [$http:badreq]", config);
        return new Observable(observer => {
            observer.error(this._ubiConstants.messages.genericErrorKey);
        });
    }
    switch (config.method) {
        case this.httpMethods.get:
            let params = new HttpParams();
            //Accepting 0, null, void 0 as empty params
            if (!!config.data) {
                if (this._ubiConstants.isStrictlyObject(config.data)) {
                    for (let key in config.data) {
                        params = params.append(key, config.data[key]);
                    }
                }
                else {
                    console.warn("Error: [CustomRest:badparams]");
                }
            }
            return this._http.get(config.url, {params: params});
        case this.httpMethods.post:
            return this._http.post(config.url, config.data);
        case this.httpMethods.del:
            return this._http.delete(config.url);
        case this.httpMethods.put:
            return this._http.put(config.url, config.data);

        default:
            console.error("Error: [CustomRest:badmethod]", this.$http.arguments);
            return new Observable(observer => {
                observer.error("Error: [CustomRest:badmethod]");
            });
    }
};

I recently discovered that you can override the type of the Observable returned by the http by doing

this._http.get<MyType>(url)

By doing my custom service I'm loosing this feature.

Is there a way (for example using generics) to override the "any" of my $http and pass its value to the _http ?

Thanks

Answer 1

You can make your function generic as well, and pass on the generic parameter to the _http methods:

$http<T>(config: CustomHttpConfig = this._generateHttpConfig()): Observable<T> {
  if (!config.method) {
    config.method = this.httpMethods.get;
  }
  if (!config.url) {
    console.error("Error: [$http:badreq]", config);
    return new Observable<T>(observer => {
      observer.error(this._ubiConstants.messages.genericErrorKey);
    });
  }
  switch (config.method) {
    case this.httpMethods.get:
      let params = new HttpParams();
      //Accepting 0, null, void 0 as empty params
      if (!!config.data) {
        if (this._ubiConstants.isStrictlyObject(config.data)) {
          for (let key in config.data) {
            params = params.append(key, config.data[key]);
          }
        }
        else {
          console.warn("Error: [CustomRest:badparams]");
        }
      }
      return this._http.get<T>(config.url, { params: params });
    case this.httpMethods.post:
      return this._http.post<T>(config.url, config.data);
    case this.httpMethods.del:
      return this._http.delete<T>(config.url);
    case this.httpMethods.put:
      return this._http.put<T>(config.url, config.data);

    default:
      console.error("Error: [CustomRest:badmethod]", this.$http.arguments);
      return new Observable<T>(observer => {
        observer.error("Error: [CustomRest:badmethod]");
      });
  }
};

Answer 2

I think this does the job:

$http<T>(config: CustomHttpConfig = this._generateHttpConfig()): Observable<T> {
    if (!config.method) {
        config.method = this.httpMethods.get;
    }
    if (!config.url) {
        console.error("Error: [$http:badreq]", config);
        return new Observable(observer => {
            observer.error(this._ubiConstants.messages.genericErrorKey);
        });
    }
    switch (config.method) {
        case this.httpMethods.get:
            let params = new HttpParams();
            //Accepting 0, null, void 0 as empty params
            if (!!config.data) {
                if (this._ubiConstants.isStrictlyObject(config.data)) {
                    for (let key in config.data) {
                        params = params.append(key, config.data[key]);
                    }
                }
                else {
                    console.warn("Error: [CustomRest:badparams]");
                }
            }
            return this._http.get<T>(config.url, {params: params});
        case this.httpMethods.post:
            return this._http.post<T>(config.url, config.data);
        case this.httpMethods.del:
            return this._http.delete<T>(config.url);
        case this.httpMethods.put:
            return this._http.put<T>(config.url, config.data);

        default:
            console.error("Error: [CustomRest:badmethod]", this.$http.arguments);
            return new Observable(observer => {
                observer.error("Error: [CustomRest:badmethod]");
            });
    }
};