Typescript - How to create nested interface for json object
15,483
Define Interfaces as below:
interface Head {
majorHeadNumber?: string;
majorHeadDescription?: string;
};
interface ServicesAndHead {
majorService?: string;
subMajorService?: string;
majorHead: Head[];
}
export interface MyTableItem {
demandNo?: string;
demandName?: string;
servicesAndHeads?:ServicesAndHead[];
}
This will be compatible with your Json object.
const dataItem: MyTableItem = {
demandNo: 'Demand Number 2',
demandName: 'Animal Husbandary, Livestock, Fisheries and Veterinary Services',
servicesAndHeads: [
{
majorService: 'C-Economic Service',
subMajorService: '(a) Agriculture and Allied Activities',
majorHead: [
{
majorHeadNumber: '3098',
majorHeadDescription: 'Animal Husbandry'
},
{
majorHeadNumber: '3999',
majorHeadDescription: 'Diary Development'
},
{
majorHeadNumber: '4902',
majorHeadDescription: 'Fisheries'
}]
},
{
majorService: 'C- Capital Account of Economic Services',
subMajorService: '(a) Capital Account of Agriculture and Allied Activities',
majorHead: [
{
majorHeadNumber: '0012',
majorHeadDescription: 'Capital Outlay on Animal '
},
{
majorHeadNumber: '3245',
majorHeadDescription: 'Capital Outlay on Fisheries'
}]
}]
}
Related videos on Youtube
Author by
Iswar
I am .Net Core Programmer with experience in Angular 7, SQL Server, Bootstrap framework and have a desire to learn
Updated on June 04, 2022Comments
-
Iswar almost 2 years
I am trying to create nested json object for which I have created Interface.I am getting error as
Type of property serservicesAndHeads are incompatible
and saysProperty is missing
. My Interface is as follows:interface Head { HeadNumber?: string; HeadDescription?: string; }; interface ServicesAndHead { majorService?: string; subMajorService?: string; servicesAndHeads:Head[]; } export interface MyTableItem { demandNo?: string; demandName?: string; servicesAndHeads?:ServicesAndHead; //servicesAndHeads?:ServicesAndHead[]; }
Where my json looks like this:
const dataItem: MyTableItem = { demandNo: 'Demand Number 2', demandName: 'Animal Husbandary, Livestock, Fisheries and Veterinary Services', servicesAndHeads: [ { majorService: 'C-Economic Service', subMajorService: '(a) Agriculture and Allied Activities', majorHead: [ { majorHeadNumber: '3098', majorHeadDescription: 'Animal Husbandry' }, { majorHeadNumber: '3999', majorHeadDescription: 'Diary Development' }, { majorHeadNumber: '4902', majorHeadDescription: 'Fisheries' } ] }, { majorService: 'C- Capital Account of Economic Services', subMajorService: '(a) Capital Account of Agriculture and Allied Activities', majorHead: [ { majorHeadNumber: '0012', majorHeadDescription: 'Capital Outlay on Animal ' }, { majorHeadNumber: '3245', majorHeadDescription: 'Capital Outlay on Fisheries' } ] } ] }
I have tried this as well for nesting of serviceAndHead
servicesAndHeads?: { [key: string]:ServicesAndHead, majorHeads?: { [key: string]:MajorHead }; };
How would I rectify my code to accept the said json.
-
Hokkyokusei over 2 yearsHow are you typecasting your JSON into the interface object? I tried typecasting with <> but it didn't work for nested inteface.
-