Adjusting the Body Parameter in Angular's HttpClient

Question

I am working with an Asp.Net Core Web API and Angular framework.

One of my actions retrieves values using the following code:

    [HttpGet]

    public ActionResult<IEnumerable<MyModel>> Get([FromBody] MyParameter parameter) { ... }

My client application calls the API like this:

return this.httpClient.get<MyModel[]>(`${environment.api}values`);

How can I set the Body in the API call?

Thanks

Answer 1

Answer №1

Sending the body as a parameter in a GET request is not allowed. It is recommended to use POST instead.

API

[HttpPost]

public ActionResult<IEnumerable<MyModel>> Get([FromBody] MyParameter parameter) { ... }

UI

return this.httpClient.post<MyModel[]>(`${environment.api}values`);

If you need to use GET, you can include the parameter properties in the querystring.

Answer 2

Sending the body as a parameter in a GET request is not allowed. It is recommended to use POST instead.

API

[HttpPost]

public ActionResult<IEnumerable<MyModel>> Get([FromBody] MyParameter parameter) { ... }

UI

return this.httpClient.post<MyModel[]>(`${environment.api}values`);

If you need to use GET, you can include the parameter properties in the querystring.

Answer 3

When using Angular's HttpGet method, you are limited in that you can only set the URL and HTTP options. Here is an example:

getConfigResponse(): Observable<HttpResponse<Config>> {
  return this.http.get<Config>(
    this.configUrl, { observe: 'response' });
}

If you need to submit a body with your request, you will have to use the post method like so:

return this.http.post<Hero>(this.heroesUrl, hero, httpOptions)

Answer 4

When using Angular's HttpGet method, you are limited in that you can only set the URL and HTTP options. Here is an example:

getConfigResponse(): Observable<HttpResponse<Config>> {
  return this.http.get<Config>(
    this.configUrl, { observe: 'response' });
}

If you need to submit a body with your request, you will have to use the post method like so:

return this.http.post<Hero>(this.heroesUrl, hero, httpOptions)