Angular Typescript how to sendi complex json data to web api when model is flat?

问题

I have been sending data to a web api that i flat, but now i am needed more complex json object

In the past... I was doing this ( It works , web api accepts flat model )

MODEL:

export class Menu {
    constructor(
 ) { }

    UserID: number;
    AppID: number;
    NavAppID: number;
    AppGroupID: number;
    SelectedCaseID: number = 0;
    SelectedRoleID: number;
 }

Component:

model = new Menu();

    this.pageService.getPageCommonData(this.model) //(this.model)
    .subscribe(
    result => {
        this.caseCaption = result["data"].CaseCaptionInfo;
        this.contextMenu = result["data"].ContextMenu;
    },
    error => {
        console.log(error);
    })

Service:

getPageCommonData(menu: Menu)  {
    return this.http.post(pageCommonData, JSON.stringify(menu), httpOptions)
        .map((response: Response)=> {
            //console.log('testtom', pageCommonData)
            return response;
        })
}

NOW, I NEED to be able to have a nested JSON object that sends to Web api

Payload from Swagger / Postman

{ 
     "PageQueryString": {
     "UserID": 61525,
     "AppID": 15,
     "AppGroupID": 118,
     "SelectedCaseNumber": "",
     "SelectedCaseID": 1423336,
     "SelectedRoleID": 94933362,
     "AutoFlowRoleID": 0,
     "Loginkey": "471303941",
     "Trantime": "1/26/2018 08:00:52 AM",
     "Task": "",
     "DataType": "",
     "From": "",
     "PageNum": 0,
     "Direction": "",
     "GUID": "",
     "UserIPAddress": "",
     "PageName": "HearingsAndEvents.asp",
     "PageContext": "Criminal"
     },
       "HearingsAndEventsType": 1
}

Notice : "HearingsAndEventsType": 1

New model

export class HearingEvent {
    constructor(
    ) { }

    UserID: number;
    AppID: number;
    AppGroupID: number;
    SelectedCaseNumber: string;
    SelectedCaseID: number = 0;
    SelectedRoleID: number;
    AutoFlowRoleID: number;
    Loginkey: string;
    Trantime: string;
    Task: string;
    DataType: string;
    From: string;
    PageNum: Number;
    Direction: string;
    GUID: string;
    UserIPAddress: string;
    PageName: string;
    PageContext: string;
    HearingsAndEventsType: number;


}

Component to call service

   model = new HearingEvent();

   this.pageService.getHearingAndEvents(this.model)
        .subscribe(
         result => {
            this.hearingEvents = result["data"];
          },
          error => {
              console.log(error);
         })

Service call:

 getHearingAndEvents(hearingEvent: HearingEvent) {
    return this.http.post(hearingEventData, JSON.stringify(hearingEvent), httpOptions)
        .map((response: Response)=> {
            return response;
        })
 }

来源：https://stackoverflow.com/questions/48570885/angular-typescript-how-to-sendi-complex-json-data-to-web-api-when-model-is-flat