I’m looking for the most efficient way to map values from an NgForm to a typescript model defined in my Angular component. The form values are coming from a datatable (p-table using PrimeNG) with varying rows. I’m getting the values defined in a JSON object. I have appended the row index to the end of each form control name (- rowIndex).
For example:

{
"controlA-0" : 123, "controlB-0" : 456, "controlC-0" : 789,
"controlA-1" : 321, "controlB-1" : 654, "controlC-1" : 987
"controlA-2" : 213, "controlB-2" : 564, "controlC-2" : 897
}

Here is my real JSON object from the NgForm (newOperationalAreaForm). The example form below has four (4) rows (counties) for the state of Hawaii in the p-table. Other forms (Different states) will have varying row counts depending on the number of counties in the selected state.

{
    "AreaOfOperationId-0": 0,
    "StateCountyLookupID-0": 544,
    "StateId-0": "12",
    "StateCode-0": "HI",
    "StateDisplayName-0": "Hawaii",
    "CountyId-0": "711",
    "CountyDisplayName-0": "Hawaii",
    "county-primary-0": true,
    "county-secondary-0": false,
    "county-na-0": false,
    "AreaOfOperationId-1": 0,
    "StateCountyLookupID-1": 545,
    "StateId-1": "12",
    "StateCode-1": "HI",
    "StateDisplayName-1": "Hawaii",
    "CountyId-1": "743",
    "CountyDisplayName-1": "Honolulu",
    "county-primary-1": false,
    "county-secondary-1": true,
    "county-na-1": false,
    "AreaOfOperationId-2": 0,
    "StateCountyLookupID-2": 546,
    "StateId-2": "12",
    "StateCode-2": "HI",
    "StateDisplayName-2": "Hawaii",
    "CountyId-2": "826",
    "CountyDisplayName-2": "Kauai",
    "county-primary-2": true,
    "county-secondary-2": false,
    "county-na-2": false,
    "AreaOfOperationId-3": 0,
    "StateCountyLookupID-3": 547,
    "StateId-3": "12",
    "StateCode-3": "HI",
    "StateDisplayName-3": "Hawaii",
    "CountyId-3": "996",
    "CountyDisplayName-3": "Maui",
    "county-primary-3": false,
    "county-secondary-3": false,
    "county-na-3": true
}

Here is the model defined in typescript that I need to map the NgForm to:

newOperationalArea= {
    AreaOfOperationId: number,
    StateCountyLookupID: number,
    State: {
      Id: string,
      Code: string,
      DisplayName: string
    },
    County: {
      Id: string,
      DisplayName: string,
    },
    county-primary: boolean,
    county-secondary: boolean,
    county-na: boolean,
  }

I tried using this code to get each control and the value but the values displayed in the console didn’t produce the values that I need to submit the object to my web api.

Object.values(newOperationalAreaForm.controls).forEach( ctl => {
   console.log(ctl);
})

Here’s the object I’m expecting to send to my web api put method:

"AreaOfOperation ="[
   {
      "AreaOfOperationId":0,
      "StateCountyLookupID":544,
      "State":{
         "Id":"12",
         "Code":"HI",
         "DisplayName":"Hawaii"
      },
      "County":{
         "Id":"711",
         "DisplayName":"Hawaii"
      },
      "county-primary":true,
      "county-secondary":false,
      "county-na":false
   },
   {
      "AreaOfOperationId":0,
      "StateCountyLookupID":545,
      "State":{
         "Id":"12",
         "Code":"HI",
         "DisplayName":"Hawaii"
      },
      "County":{
         "Id":"743",
         "DisplayName":"Honolulu"
      },
      "county-primary":false,
      "county-secondary":true,
      "county-na":false
   },
   {
      "AreaOfOperationId":0,
      "StateCountyLookupID":546,
      "State":{
         "Id":"12",
         "Code":"HI",
         "DisplayName":"Hawaii"
      },
      "County":{
         "Id":"826",
         "DisplayName":"Kauai"
      },
      "county-primary":true,
      "county-secondary":false,
      "county-na":false
   },
   {
      "AreaOfOperationId":0,
      "StateCountyLookupID":547,
      "State":{
         "Id":"12",
         "Code":"HI",
         "DisplayName":"Hawaii"
      },
      "County":{
         "Id":"996",
         "DisplayName":"Maui"
      },
      "county-primary":false,
      "county-secondary":false,
      "county-na":false
   }
]