[Fixed] How can I combine two URLSearchParams in Angular/TypeScript?

Issue

I have two URLSearchParams objects, and I want to make a third one of those two combined.

For example, I could have

let params1 = new URLSearchParams();
params1.set('page', 'one');
params1.set('size', 'hundred');

let params2 = new URLSearchParams();
params2.set('orderBy', 'size');
params2.set('order', 'asc');

let params = params1 + params2; // yes, that's illegal, but how to do that?

and I need to have all 4 parameters in the params object.

I wanted to iterate through the object key-value pairs using .entries() method, but TypeScript hides this method. Here is what I’ve found in lib.dom.d.ts file:

interface URLSearchParams {
    append(name: string, value: string): void;
    delete(name: string): void;
    get(name: string): string | null;
    getAll(name: string): string[];
    has(name: string): boolean;
    set(name: string, value: string): void;
}

declare var URLSearchParams: {
    prototype: URLSearchParams;
    new (init?: string | URLSearchParams): URLSearchParams;
};

So it looks like there’s no possible option to iterate through URLSearchParams in TS. Any ideas?

Solution

You can use appendAll() method see Docs as below,

let params1 = new URLSearchParams();
params1.set('page', 'one');
params1.set('size', 'hundred');

let params2 = new URLSearchParams();
params2.set('orderBy', 'size');
params2.set('order', 'asc');
let params=new URLSearchParams();
params.appendAll(params1);
params.appendAll(params2);
console.log(params)

LIVE DEMO