我有以下界面和代码。我以为我正确地做了定义但是我收到了一个错误:
interface IenumServiceGetOrderBy { id: number; label: string; key: any }[];
和
getOrderBy = (entity): IenumServiceGetOrderBy => {
var result: IenumServiceGetOrderBy;
switch (entity) {
case "content":
result =
[
{ id: 0, label: 'CId', key: 'contentId' },
{ id: 1, label: 'Modified By', key: 'modifiedBy' },
{ id: 2, label: 'Modified Date', key: 'modified' },
{ id: 3, label: 'Status', key: 'contentStatusId' },
{ id: 4, label: 'Status > Type', key: ['contentStatusId', 'contentTypeId'] },
{ id: 5, label: 'Title', key: 'title' },
{ id: 6, label: 'Type', key: 'contentTypeId' },
{ id: 7, label: 'Type > Status', key: ['contentTypeId', 'contentStatusId'] }
];
break;
}
return result;
};
错误:
Error 190 Cannot convert '{}[]' to 'IenumServiceGetOrderBy':
Type '{}[]' is missing property 'id' from type 'IenumServiceGetOrderBy'
答案 0 :(得分:138)
您不需要来使用索引器(因为它的类型安全性稍差)。您有两种选择:
interface EnumServiceItem {
id: number; label: string; key: any
}
interface EnumServiceItems extends Array<EnumServiceItem>{}
// Option A
var result: EnumServiceItem[] = [
{ id: 0, label: 'CId', key: 'contentId' },
{ id: 1, label: 'Modified By', key: 'modifiedBy' },
{ id: 2, label: 'Modified Date', key: 'modified' },
{ id: 3, label: 'Status', key: 'contentStatusId' },
{ id: 4, label: 'Status > Type', key: ['contentStatusId', 'contentTypeId'] },
{ id: 5, label: 'Title', key: 'title' },
{ id: 6, label: 'Type', key: 'contentTypeId' },
{ id: 7, label: 'Type > Status', key: ['contentTypeId', 'contentStatusId'] }
];
// Option B
var result: EnumServiceItems = [
{ id: 0, label: 'CId', key: 'contentId' },
{ id: 1, label: 'Modified By', key: 'modifiedBy' },
{ id: 2, label: 'Modified Date', key: 'modified' },
{ id: 3, label: 'Status', key: 'contentStatusId' },
{ id: 4, label: 'Status > Type', key: ['contentStatusId', 'contentTypeId'] },
{ id: 5, label: 'Title', key: 'title' },
{ id: 6, label: 'Type', key: 'contentTypeId' },
{ id: 7, label: 'Type > Status', key: ['contentTypeId', 'contentStatusId'] }
]
我个人推荐选项A(当你使用类而不是接口时更简单的迁移)。
答案 1 :(得分:57)
您可以使用indexer定义界面:
interface EnumServiceGetOrderBy {
[index: number]: { id: number; label: string; key: any };
}
答案 2 :(得分:45)
您只需扩展Array接口即可将接口定义为数组。
export interface MyInterface extends Array<MyType> { }
有了这个,任何实现MyInterface
的对象都需要实现数组的所有函数调用,并且只能存储MyType
类型的对象。
答案 3 :(得分:9)
请勿使用
interface EnumServiceGetOrderBy {
[index: number]: { id: number; label: string; key: any };
}
对于所有Arrays属性和方法(例如拼接等),您将得到错误。
解决方案是创建一个接口,该接口定义另一个接口的数组(它将定义对象)
例如:
interface TopCategoriesProps {
data: Array<Type>;
}
interface Type {
category: string;
percentage: number;
}
答案 4 :(得分:4)
没有tslint错误的简单选项......
export interface MyItem {
id: number
name: string
}
export type MyItemList = [MyItem]
答案 5 :(得分:4)
像这样使用!
interface Iinput {
label: string
placeholder: string
register: any
type?: string
required: boolean
}
// This is how it can be done
const inputs: Array<Iinput> = [
{
label: "Title",
placeholder: "Bought something",
register: register,
required: true,
},
]
答案 6 :(得分:1)
如果您不想创建全新的类型,则为嵌入式版本:
export interface ISomeInterface extends Array<{
[someindex: string]: number;
}> { };
答案 7 :(得分:1)
您也可以这样做。
interface IenumServiceGetOrderBy {
id: number;
label: string;
key: any;
}
// notice i am not using the []
var oneResult: IenumServiceGetOrderBy = { id: 0, label: 'CId', key: 'contentId'};
//notice i am using []
// it is read like "array of IenumServiceGetOrderBy"
var ArrayOfResult: IenumServiceGetOrderBy[] =
[
{ id: 0, label: 'CId', key: 'contentId' },
{ id: 1, label: 'Modified By', key: 'modifiedBy' },
{ id: 2, label: 'Modified Date', key: 'modified' },
{ id: 3, label: 'Status', key: 'contentStatusId' },
{ id: 4, label: 'Status > Type', key: ['contentStatusId', 'contentTypeId'] },
{ id: 5, label: 'Title', key: 'title' },
{ id: 6, label: 'Type', key: 'contentTypeId' },
{ id: 7, label: 'Type > Status', key: ['contentTypeId', 'contentStatusId'] }
];
答案 8 :(得分:1)
其他简单选项:
interface simpleInt {
id: number;
label: string;
key: any;
};
type simpleType = simpleInt[];
答案 9 :(得分:1)
在Angular中,使用“扩展”定义对象“数组”的接口。
使用索引器会给您一个错误,因为它不是Array接口,因此不包含属性和方法。
例如
错误TS2339:类型“ ISelectOptions2”上不存在属性“查找”。
// good
export interface ISelectOptions1 extends Array<ISelectOption> {}
// bad
export interface ISelectOptions2 {
[index: number]: ISelectOption;
}
interface ISelectOption {
prop1: string;
prop2?: boolean;
}
答案 10 :(得分:1)
编程很简单。使用简单的用例:
interface IenumServiceGetOrderBy { id: number; label: string; key: any }
// OR
interface IenumServiceGetOrderBy { id: number; label: string; key: string | string[] }
// use interface like
const result: IenumServiceGetOrderBy[] =
[
{ id: 0, label: 'CId', key: 'contentId' },
{ id: 1, label: 'Modified By', key: 'modifiedBy' },
{ id: 4, label: 'Status > Type', key: ['contentStatusId', 'contentTypeId'] }
];
答案 11 :(得分:1)
以下是适合您的示例的一种解决方案:
interface IenumServiceGetOrderByAttributes {
id: number;
label: string;
key: any
}
interface IenumServiceGetOrderBy extends Array<IenumServiceGetOrderByAttributes> {
}
let result: IenumServiceGetOrderBy;
使用此解决方案,您可以使用Array的所有属性和方法(例如:
length, push(), pop(), splice()
...)