RequestOptionsArgs Interface not Allowing Access to UrlSearchParams Object

[britztopher]

I'm submitting a ... (check one with "x")

[ x ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

When using RequestOptionsArgs Interface and then instantiate the params object with UrlSearchParams like so:
request.options.params = new URLSearchParams();

I cannot use any function in UrlSearchParams Object. For example:

request.options.params.get('key') or request.options.params.paramsMap.get('key');

If I change the current interface to:

export interface RequestOptionsArgs {
    url?: string;
    method?: string | RequestMethod;
    /** @deprecated from 4.0.0. Use params instead. */
    search?: string | URLSearchParams | {
        [key: string]: any | any[];
    };
    params?: URLSearchParams;
    headers?: Headers;
    body?: any;
    withCredentials?: boolean;
    responseType?: ResponseContentType;
}

Notice how i put just UrlSearchParams in as a type explicitly all is well.

Expected behavior

I expect to be able to use the functions associated with UrlSearchParams interface.

Minimal reproduction of the problem with instructions

1. create a class that uses RequestOptionsArgs
2. initalize params object with request.options.params = new UrlSearchParams()
3. try to use anything on params object. like request.options.params.get('key');
   I get this TS error:

 TS2339: Property 'get' does not exist on type 'string | URLSearchParams | { [key: string]: any; }'.
  Property 'get' does not exist on type 'string'.

What is the motivation / use case for changing the behavior?

Not trying to change the behavior, but just trying to use it as it was designed to be used.
Please tell us about your environment:

Mac OSX El Capitan, Webstorm IDE, yarn/npm, Webpack dev server for testing

• Angular version: 4.0.X

• Language: TypeScript 2.2.1

• Node (for AoT issues): node --version = 6.1.0

[DzmitryShylovich]

Yeah, it's a known issue. Request wasn't designed to work with RequestOptionsArgs directly. You need to use RequestOptions object:

const req = new Request(new RequestOptions({
          url: 'test',
          method: 'GET',
          body: null,
          headers: new Headers({'content-type': 'application/json'})
        }));

it will be fixed in 4.1

[britztopher]

@DzmitryShylovich Thanks!!!
Ok, I am going to leave issue open until 4.1 fix is in then.

[alxhub]

Hi @britztopher,

This is because the signature of RequestOptionsArgs.params allows more than just URLSearchParams, you can also pass a string for example.

This is working as intended. You could always keep a direct reference to your URLSearchParams object and mutate it that way.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}