angular - 如何在 Angular/TypeScript 中组合两个 URLSearchParams？

Question

我有两个 URLSearchParams对象，我想将这两者结合起来制作第三个。

例如，我可以有

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?

我需要在 params 对象中包含所有 4 个参数。

我想使用 .entries() 遍历对象键值对方法，但是 TypeScript 隐藏了这个方法。这是我在 lib.dom.d.ts 中找到的内容文件:

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;
};

所以看起来没有可能的选项来迭代 URLSearchParams在 TS。有任何想法吗？

Answer 1

由于已接受的解决方案特定于 Angular，因此这里有一个适用于 vanilla JS 的解决方案:

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

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

let combined = new URLSearchParams({
  ...Object.fromEntries(params1),
  ...Object.fromEntries(params2)
});

console.log(combined.toString());
// page=two&size=hundred&orderBy=size&order=asc