时间戳

首页 > 解决方案 > Typescript/Angular 12：将自定义对象转换为参数对象

angular - Typescript/Angular 12：将自定义对象转换为参数对象

问题描述

我想使用 的fromObject键HttpParamsOptions将自定义对象转换为参数对象。

这有效：

foo(): void {
   const testObject = {
     id: 123;
     name: 'test';
     someExample: 'test';
   }
   const httpParams = new HttpParams({ fromObject: testObject });
   ...
}

这不起作用：

export interface SearchParams {
  id: number;
  name: string;
  someExample: string;
}

foo(testObject: SearchParams): void {
   const httpParams = new HttpParams({ fromObject: testObject });
   ...
}

fromObject如果我定义对象类型，则不起作用。

错误：TS2322：类型 'SearchParams' 不可分配给类型 '{ [param: string]: string | 号码 | 布尔值 | 只读（字符串|数字|布尔）[]；}'。“SearchParams”类型中缺少索引签名。

任何想法如何解决这个问题？我正在使用 Angular 12。

标签： angulartypescript

解决方案

最简单的方法：

   const httpParams = new HttpParams({ fromObject: {...testObject} });

发生错误是因为您的参数类型SearchParams与 fromObject 类型不匹配，即：

    fromObject?: {
        [param: string]: string | number | boolean | ReadonlyArray<string | number | boolean>;
    };

基本上fromObjectparam 接受任何文字对象。

因此，您可以通过一些不同的方式获得相同的结果。例如...

声明一个文字对象（就像你一样）：

    const testObject = {
      id: 123;
      name: 'test';
      someExample: 'test';
    }
    const httpParams = new HttpParams({ fromObject: testObject  });

使用扩展运算符声明从另一个对象复制的对象：

    const myObject = { ...testObject };
    const httpParams = new HttpParams({ fromObject: myObject  });

或转换为any类型：

   const httpParams = new HttpParams({ fromObject: testObject as any });

从关于类型的打字稿文档any：

当你不想写出一个长类型来让 TypeScript 相信特定的代码行是可以的时，any 类型很有用。

或者将接口更改为与参数类型SearchParams兼容：fromObject

  export interface SearchParams {
    id: number;
    name: string;
    someExample: string;
    [param: string]: string | number;
  }
    
  foo(testObject: SearchParams): void {
    const httpParams = new HttpParams({ fromObject: testObject });
  }

推荐阅读