Ayush
Ayush

Reputation: 179

Sort Array of object having nested childs in Angular (7)

I was trying to sort the response payload base on the object field "sortOrderNumber" which contains the inner child.

Response Payload:

{   
    "content":
    [ 
        {
            "eserviceSettings":[ 
            { 
               "serviceName":"Licenses",
               "sortOrderNumber":5,
               "eserviceSettings":[ 
                  { 
                     "serviceName":"Manning Licenses",
                     "sortOrderNumber":2,
                     "eserviceSettings":[ 
                        { 
                           "serviceName":"Enquiry on Application Status",
                           "sortOrderNumber":2,
                           "eserviceSettings":[ 
                           ]
                        },
                        { 
                           "serviceName":"Enquiry of Manning Licence and Submission",
                           "sortOrderNumber":1,
                           "eserviceSettings":[ 
                           ]
                        }
                     ]
                  },
                  { 
                     "serviceName":"Craft Licenses",
                     "sortOrderNumber":1,
                     "eserviceSettings":[ 
                        { 
                           "serviceName":"Application for New Harbour Craft Licence",
                           "sortOrderNumber":2,
                           "eserviceSettings":[ 
                           ]
                        },
                        { 
                           "serviceName":"Application for New Pleasure Craft Licence",
                           "sortOrderNumber":1,
                           "eserviceSettings":[ 
                           ]
                        }
                     ]
                  },
                  { 
                     "serviceName":"Craft Inspection Booking",
                     "sortOrderNumber":5,
                     "eserviceSettings":[ 
                     ]
                  }
               ]
            }
            ]
        }
    ]
}

I tried the below code

const childEservices = content[0].eserviceSettings;
this.postLoginDashboardData = allObjs.concat(childEservices);
this.postLoginDashboardData.sort((a: any, b: any) =>  a.sortOrderNumber - b.sortOrderNumber);
      this.postLoginDashboardData.forEach( (element) => {
        element.eserviceSettings.sort((a: any, b: any) =>  a.sortOrderNumber - b.sortOrderNumber);
      });

The result after After sorting is below where in the inner childs are not getting sorted.Not sure where i am missing.

{   
        "content":
        [ 
            {
                "eserviceSettings":[ 
                { 
                   "serviceName":"Licenses",
                   "sortOrderNumber":5,
                   "eserviceSettings":[
                    { 
                         "serviceName":"Craft Licenses",
                         "sortOrderNumber":1,
                         "eserviceSettings":[ 
                            { 
                               "serviceName":"Application for New Harbour Craft Licence",
                               "sortOrderNumber":2,
                               "eserviceSettings":[ 
                               ]
                            },
                            { 
                               "serviceName":"Application for New Pleasure Craft Licence",
                               "sortOrderNumber":1,
                               "eserviceSettings":[ 
                               ]
                            }
                         ]
                      },
                      { 
                         "serviceName":"Manning Licenses",
                         "sortOrderNumber":2,
                         "eserviceSettings":[ 
                            { 
                               "serviceName":"Enquiry on Application Status",
                               "sortOrderNumber":2,
                               "eserviceSettings":[ 
                               ]
                            },
                            { 
                               "serviceName":"Enquiry of Manning Licence and Submission",
                               "sortOrderNumber":1,
                               "eserviceSettings":[ 
                               ]
                            }
                         ]
                      }
                      ,
                      { 
                         "serviceName":"Craft Inspection Booking",
                         "sortOrderNumber":5,
                         "eserviceSettings":[ 
                         ]
                      }
                   ]
                }
                ]
            }
        ]
    }

Any help to achive sorting in better way with minimal code. The result i was trying to get is below

{   
    "content":
    [ 
        {
            "eserviceSettings":[ 
            { 
               "serviceName":"Licenses",
               "sortOrderNumber":5,
               "eserviceSettings":[
                { 
                     "serviceName":"Craft Licenses",
                     "sortOrderNumber":1,
                     "eserviceSettings":[ 
                        { 
                           "serviceName":"Application for New Pleasure Craft Licence",
                           **"sortOrderNumber":1,**
                           "eserviceSettings":[ 
                           ]
                        },
                        { 
                           "serviceName":"Application for New Harbour Craft Licence",
                           **"sortOrderNumber":2,**
                           "eserviceSettings":[ 
                           ]
                        }
                     ]
                  },
                  { 
                     "serviceName":"Manning Licenses",
                     "sortOrderNumber":2,
                     "eserviceSettings":[
                        { 
                           "serviceName":"Enquiry of Manning Licence and Submission",
                           **"sortOrderNumber":1,**
                           "eserviceSettings":[ 
                           ]
                        },                       
                        { 
                           "serviceName":"Enquiry on Application Status",
                           **"sortOrderNumber":2,**
                           "eserviceSettings":[ 
                           ]
                        }
                     ]
                  },
                  ,
                  { 
                     "serviceName":"Craft Inspection Booking",
                     "sortOrderNumber":5,
                     "eserviceSettings":[ 
                     ]
                  }
               ]
            }
            ]
        }
    ]
}

Thank you in advance.

Upvotes: 0

Views: 982

Answers (1)

Raj Shah
Raj Shah

Reputation: 846

After sorting the first time use the following:

function sortRecursive(data) {
  if (data[0]) {
    data.forEach( (element) => {
      if (element.eserviceSettings) {
        element.eserviceSettings.sort((a, b) =>  a.sortOrderNumber - b.sortOrderNumber);
        sortRecursive(element.eserviceSettings);
      }
    });
  }
}

Upvotes: 2

Related Questions