Angular 9 get data with querystring params

Question

I am trying to get data from search API. The search value is passed as a query string.

No errors at compile time, no errors at runtime.

const params = new HttpParams().set('search', 'pizza');
this.http
    .get('/hello', { responseType: 'json', params })
    .subscribe(console.log, console.log);

Generates the /hello GET query but without the query string parameters.

What's wrong?

Angular exact version is 9.1.11

EDIT

The issue does not come from Angular but on how I try to embed the app. It works when using the default dev server without trying to embed it.

Try to specify the property: { responseType: 'json', params: params } — Barremian
– Barremian, Commented Jun 15, 2020 at 20:26

Manish · Accepted Answer · 2020-06-15 20:20:43Z

1

I guess you need to specify which option to assign params to.

Try this:

const apiParams = new HttpParams().set('search', 'pizza');
this.http
    .get('/hello', { responseType: 'json', params: apiParams })
    .subscribe(console.log, console.log);

edited Jun 15, 2020 at 20:20

answered Jun 15, 2020 at 20:15

Manish

6,32419 gold badges67 silver badges91 bronze badges

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

7 Comments

Rick Over a year ago

what' different?

Manish Over a year ago

params: apiParams

Rick Over a year ago

oh right. syntax error. he just forgot to add ': params'

Manish Over a year ago

Yup. Please do accept the answer if it helped solve the issue.

AirGoatOne Over a year ago

This symtax is correct {params} as it is a ES6 shortcut for {params: params}

|

AirGoatOne · Accepted Answer · 2020-06-16 06:51:32Z

0

There is no issue with Angular or the syntax I am using. The issue came from the integration I tried to do. I tried to embed the Angular App in a web page and develop from there.

It doesn't seem to be a good idea.

Everything work with the default dev server.

answered Jun 16, 2020 at 6:51

AirGoatOne

911 silver badge4 bronze badges

Collectives™ on Stack Overflow

Angular 9 get data with querystring params

2 Answers 2

7 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related