using the request method in Angular's HttpClient class

1
votes

I'm developing a service in Angular 4 which must offer a generic http request method (instead of separated get, put, post ... ). I'm trying to use the request method in HttpClient, but I can't manage to pass the required options parameters. My code looks roughly like this:

let options = { 
    headers: headers,
    content: content,
    responseType: ????,
    observe: ??????
};

http.request(method, url, options)
     .map(res => new SeamResponse(res.status, res.json()))

Now, I'm having two problems:

  1. I can't manage to pass the reponseType option, because if I specify a value like 'json', I get this eror:

error TS2345: Argument of type '{ headers: HttpHeaders; content: string; responseType: string; }' is not assignable to parameter of type '{ body?: any; headers?: HttpHeaders; params?: HttpParams; observe?: HttpObserve; reportProgress?:...'. Types of property 'responseType' are incompatible. Type 'string' is not assignable to type '"json" | "arraybuffer" | "blob" | "text"'.

  1. Neither can I pass the observe options, because it is in a type which is apparently not exported from the HttpClient class.

error TS2305: Module '"/Users/pchacin/Documents/workspace/seam-sdk-core-ts/node_modules/@angular/common/http"' has no exported member 'HttpObserve'.

  1. I can't manage to process the response because it doesn't recognise the map method, which I understand is standard for Observable:

error TS2339: Property 'map' does not exist on type 'Observable'.

Many thanks in advance

EDIT:

Question 2 is solved in the latest version of angular (4.4.1) as an experiment feature by exporting HttpObserve, however discussions about the topic in github suggest the HttpObserve type will be removed and this option will be defined as string, so I'm not inclined to follow this path. The question I have is: the request method has been around for some time, since 4.2, at least Hasn't anyone used it ever? if so, how?

3
angular
Not one thing in the options are required according to the docs. Only pass what you have. – R. Richards
See github.com/angular/angular/issues/18586#issuecomment-323216764 . HttpObserve is a string. does not exist on type 'Observable' is widely known error, this question it was answered numerous times. – Estus Flask
@R.Richards the problem is I need to set them – pablochacin
@estus The discussion you refers me to actually confimrs HttpObserver is not an string. – pablochacin
There's nothing to make guesses about. If you're not sure about something, check source code github.com/angular/angular/blob/4.4.1/packages/common/http/src/… – Estus Flask

3 Answers

4
votes

add type Object, then you can use options as a parameter of request()/get()/post() method 

let options: Object = { 
    headers: headers,
    content: content,
    responseType: 'text' as 'tex',
    observe: 'response' as 'response'
 };
2
votes

It happens that the error with the responseType is related to an issue with TypeScript and literal string types. The proper way to specify it is:

let options = { 
    headers: headers,
    content: content,
    responseType: 'text' as 'tex',
    observe: 'response' as 'response'
 };
-1
votes

Maybe you can use Angular's Enum itself:

responseType: ResponseType.Default