代码之家 › 专栏 › 技术社区 › Reza

如何在TypeScript中为具有动态属性的对象定义类型

typescript-typings typescript

Reza · 技术社区 · 7 年前

title order

appraisalGroups: Array<{
    title: string,
    order: number,
    [key:string]: number,
}>;

稍后会这样分配(这只是我的read应用程序中的一个示例,其中会有一个循环,键来自restapi)

this.appraisalGroups[0]['mykey1'] = 5

我犯了个错误

“string”类型的属性“title”不可分配给字符串索引类型“number”

1 回复 | 直到 7 年前

Willwsharp 7 年前

之所以会出现这种情况,是因为索引签名强制所有属性与其返回类型匹配。如Typescript文件所述: https://www.typescriptlang.org/docs/handbook/interfaces.html

虽然字符串索引签名是描述字典模式的一种强大方法,但它们还强制要求所有属性与其返回类型匹配。

索引签名明确表示“每当使用此类型的值对该对象进行索引时,它将返回该类型的值”。

在您的示例中,您的索引签名表示“每当使用字符串索引此对象时,它将返回一个数字”。但是,编译器发现这个规则可能会被破坏,因为您的一个属性不是数字,所以它会抛出一个错误。

我不确定您的问题空间是什么,但是如果动态属性都有共同点,那么创建一个接口来抽象它们的共同点可能会更容易。如何使用上述接口实际上取决于您想做什么。

编辑:你也可以厚颜无耻,走捷径,简单地使用联合类型。所以 [key:string]: number 你知道吗 [key:string]: number | string .

推荐文章

Kareem Adel · 创建函数类型(TypeScript接口)

4 年前

Marcin Sieradzki · 类型按钮中的属性“fit”不能分配给基类型“IButton”中的同一属性。类型“string”不能分配给类型“Fit”

4 年前

tmokmss · TypeScript中记录<K,T>和{[键:K]:T}之间有什么区别?

4 年前

Angulandy2 · Angular 5 viewchild仅工作一次

8 年前

Michael Wilson · 自定义模块模式的TypeScript类型定义

8 年前

donzul · 如何键入接收动态参数并执行递归的函数

8 年前

Milad Rezazadeh · npm包的可安装typescript类型定义

8 年前

ranjit redekar · 如何将js文件从Angular assets文件夹加载到特定的Angular(2,4,5)组件或模块?

8 年前

Ruben · 具有变量键的嵌套TypeScript对象

8 年前

Tom Hudson · TypeScript:从装饰器推断返回类型?

8 年前