Getting error as Argument of type '{ headers: HttpHeaders; }' is not assignable to parameter of type 'HttpParamsOptions'

Question

So currently our project is on Angular version 4, we are trying to upgrade it to Angular 7. When I put the new http Module it started throwing the error: Argument of type '{ headers: HttpHeaders; }' is not assignable to parameter of type 'HttpParamsOptions'.

Before this change we were using RequestOptions but now it has been deprecated from Angular 7.

Code From Angular 4:

   options(): RequestOptions {
     const headers = new Headers();
     headers.append('Content-Type', 'application/json; charset=utf-8');
     let options = new RequestOptions({ headers: headers });
     return options;
   }

Code from Angular 7

      options(): HttpParams {
        const headers = new HttpHeaders();
        headers.append('Content-Type', 'application/json; charset=utf-8');
        let options = new HttpParams ({ headers: headers });
        return options;
      }

Answer 1

You are putting the params in the headers, when now they are separated from the params:

So the params and the headers go in different way. So in your scenario would look something like this:

      options(): HttpHeaders {
        const headers = new HttpHeaders({'Content-Type', 'application/json; charset=utf-8'});
        return headers ;
      }

Note that I get rid from the headers.append too.

Your get now should look like:

headers = options();
this.http.get(url, { headers });

If you want params, yo do it in a separate way:

headers = options();
params = new HttpParams(); 
this.http.get(url, { headers , params});