Angular 14 Http get request pass Object as param

Question

I need to pass this object via http.get to my backend:

export class InboxParameter 
{
   userId: string = "";
   inboxFolderId: number = 0;
}

and here is my InboxItem Class:

import { SafeResourceUrl } from "@angular/platform-browser";

export class InboxItem {
  letterReceiverId: number = 0;
  senderFullName: string = "";
  subject: string = "";
  isRead: string = "";
  keyWords: string = "";
  messages: number = 0;
  rulesOK: string = "";
  attachmentCount: number = 0;
  starred: boolean = false;
  faceImage: string = "";
  image: SafeResourceUrl = "";
}

and this is how I send the get request inside my angular service:

getInbox(inboxParameter: InboxParameter): Observable<InboxItem[]> {    
    let url = `${this.baseUrl}/${ApiPaths.Automation}/GetInbox`;
    return this.http.get<InboxItem[]>(url, inboxParameter);
  }

this is my backend method:

  public ActionResult<List<BLL.DTO.AutomationDTO.InboxItem>> GetInbox(BLL.DTO.AutomationDTO.InboxParameter Parameter)
{...}

but this line return this.http.get<InboxItem[]>(url, inboxParameter); gives me the following error:

Type 'Observable' is not assignable to type 'Observable<InboxItem[]>'. Type 'ArrayBuffer' is missing the following properties from type 'InboxItem[]': length, pop, push, concat, and 28 more

GET request bodies have no defined semantics in REST, which is why the method doesn't support passing them. — jonrsharpe
– jonrsharpe, Commented Dec 6, 2022 at 8:00
while this is true, sending via header as a JSON object solved the problem. thanks — Behnam Faghih
– Behnam Faghih, Commented Dec 7, 2022 at 5:46

Martino Bordin · Accepted Answer · 2022-12-06 10:01:14Z

2

GET doesn't support body, so you must use the query string to pass your object to the backend.

1- Define a method that converts your input to an HttpParams object

 public ToHttpParams(request: any): HttpParams {
    let httpParams = new HttpParams();
    Object.keys(request).forEach(function (key) {
      httpParams = httpParams.append(key, request[key]);
    });
    return httpParams;
  }

2- Call the backend in this way:

return this.http.get<InboxItem[]>(url, { params: ToHttpParams(inboxParameter)});

answered Dec 6, 2022 at 10:01

Martino Bordin

1,4711 gold badge15 silver badges31 bronze badges

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

Collectives™ on Stack Overflow

Angular 14 Http get request pass Object as param

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related