Angular interface with nested arrays

Question

I'm new to angular and I'm coming from java, so I'm used to setting up class as data structures for my data. After some research I learn I should be using interfaces but I'm have a problem figuring out how I can set up an interface with nested arrays. Each of the arrays are just field / header pairs for creating a table. The object will be an array of them. But I have two tables that will have a two row header and I'm trying to figure out how to structure the interface.

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' }
            ]}
    ]}
];

Please add how you would have typed this in Java. The data type structure is unclear. — Nino Filiu
– Nino Filiu, Commented Mar 3, 2019 at 14:23

Sajeetharan · Accepted Answer · 2019-03-03 10:33:50Z

7

You can use json2ts helper site to convert your JSON object to an interfaces which looks like as follows,

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[];
    }

}

answered Mar 3, 2019 at 10:33

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Craig Liston Over a year ago

Thank you for the link that will help immensely. This was a late night coding exercise and I realized I needed to make a more layered object instead of trying to use the base object for all the pieces.

Collectives™ on Stack Overflow

Angular interface with nested arrays

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related