网站搜索

angular - 在 Typescript 中向接口数组列表添加项目


我有一个名为 SelectItem 的接口,是由 primeNG 自动创建的,如下所示。我想创建一个实例并添加我的选择项数组。如果 SelectItem 是类而不是接口,代码将可以工作。但现在会报错。请不要建议将 SelectItem 的类型从接口改为"类"。我不能更改它,因为它是 primeNG 的组件。我如何才能实现这个目标?

选择项.ts

export interface SelectItem {
    label?: string;
    value: any;
    styleClass?: string;
    icon?: string;
    title?: string;
    disabled?: boolean;
}

我的方法

  addUnselectedItem(selectItemList: SelectItem[]) {
    let selectItem = new SelectItem(); //this row giving error
    selectItem.value = "";
    selectItem.label = "Please Select";

    selectItemList.push(selectItem);
  }

答案#1

你可以简单地:

selectItemList.push({
  value: "",
  label: "Please Select",
});

https://www.typescriptlang.org/docs/handbook/interfaces.html

TypeScript 的核心原则之一是类型检查关注值的形状。这有时被称为“鸭子类型”或“结构子类型”。在 TypeScript 中,接口的作用是为这些类型命名,并且是在你的代码内部以及与项目外部代码定义合约的强大方式。

所以任何符合该契约的对象都可以被认为是一个 SelectItem。创建一个实例实际上没有多大意义,因为在运行时接口会被完全去除。它们只是为了“开发时”的方便。

答案#2

你不能创建接口的实例,但你可以做如下操作

let selectItem :SelectItem; 
selectItem.value = "";
selectItem.label = "Please Select";

selectItemList.push(selectItem);