网站搜索

typescript - 带有嵌套数组的 Angular 接口


我刚接触 Angular,之前是 Java 背景,所以我习惯于将类作为数据结构来设置我的数据。经过一些研究,我了解到我应该使用接口,但我在弄清楚如何设置嵌套数组的接口时遇到了问题。每个数组只是用于创建表格的字段/标题对。对象将是它们的数组。但是我有两个表格,它们有两行标题,我正在尝试弄清楚如何构建接口的结构。

interface TableHeaderDetails {
    field: string;
    header: string;
    date?: <what goes here>;
}

forecastCol: TableHeaderDetails[];

this.forecastCol = [
    { field: 'cumulativeExpected', header: 'Cumulative Expected ' },
    { field: 'cumulativeReceived', header: 'Cumulative Received' },
    { date : [
        { field: 'forecastYearMonth', header: 'Year - Month' },
            { details: [
                { field: 'expected', header: 'Expected' },
                { field: 'received', header: 'Received' }
            ]}
    ]}
];

答案#1

你可以使用 json2ts 辅助网站将你的 JSON 对象转换为如下所示的接口,

declare module namespace {

    export interface Detail {
        field: string;
        header: string;
    }

    export interface Date {
        field: string;
        header: string;
        details: Detail[];
    }

    export interface RootObject {
        field: string;
        header: string;
        date: Date[];
    }

}