[Angular] HttpParams

It is possible to use HttpParams to set http params.

For example we have this url to make:

https://angular-http-guide.firebaseio.com/courses.json?orderBy="$key"&limitToFirst=1

So there are two params:

　　1. orderby

　　2. limitToFirst

Using HttpParams:

import {HttpParams} from "@angular/common/http";

const params = new HttpParams()
    .set('orderBy', '"$key"')
    .set('limitToFirst', "");

this.courses$ = this.http
    .get("/courses.json", {params})
    .do(console.log)
    .map(data => _.values(data))

To notice that HttpParams's instance is an immutable object, everytime you call 'set()' method on it, it will create a new object, so you need to use chain method.

Equivalent way:

const params = new HttpParams({
  fromString: 'orderBy="$key"&limitToFirst=1'
});

Original Article