How To Filter and Find any object related to n level of Child object (like multilevel menu)

 How To Filter and Find any object related to n level of Child object (like multilevel menu)



Example Json:

{

  "data": [

    {

      "MenuName": "Dashboard",

      "MenuLink": "/dashboard",

      "MenuParentId": "",

      "MenuIcon": "icon-speedometer",

      "IsChargeableMenu": "false",

      "MenuUUID": "43af0d5a-2989-47d4-98b7-72ff188a64a1",

      "IsInternalMenu": "false",

      "MenuTooltip": "Dashboard"

    },

    {

      "MenuName": "AnalyseFAST",

      "MenuLink": "/graph",

      "MenuParentId": "",

      "MenuIcon": "icon-pie-chart",

      "IsChargeableMenu": "true",

      "MenuUUID": "b1a908fa-6588-4c9b-8131-beda7ab21ae2",

      "IsInternalMenu": "false",

      "MenuTooltip": "AnalyseFAST"

    },

    {

      "MenuName": "General Settings",

      "MenuLink": "/generalsettings",

      "MenuParentId": "",

      "MenuIcon": "icon-menu",

      "IsChargeableMenu": "false",

      "MenuUUID": "a1152c48-9617-4fcf-9df0-b62dc4ee05f4",

      "IsInternalMenu": "false",

      "ChildMenus": [

        {

          "MenuName": "Roles",

          "MenuLink": "/generalsettings/roles",

          "MenuParentId": "a1152c48-9617-4fcf-9df0-b62dc4ee05f4",

          "MenuIcon": "icon-plus",

          "IsChargeableMenu": "false",

          "MenuUUID": "a7b99a52-22c7-4d99-9609-3819bffa4419",

          "IsInternalMenu": "false",

          "ChildMenus": [

            {

              "MenuName": "Create",

              "MenuLink": "/generalsettings/roles/add-roles",

              "MenuParentId": "a7b99a52-22c7-4d99-9609-3819bffa4419",

              "MenuIcon": "icon-arrow-right",

              "IsChargeableMenu": "false",

              "MenuUUID": "5140ce3e-e4c4-4e89-8beb-7f7b86ff124d",

              "IsInternalMenu": "false",

              "MenuTooltip": "Create New Roles"

            },

            {

              "MenuName": "View",

              "MenuLink": "/generalsettings/roles/view-roles",

              "MenuParentId": "a7b99a52-22c7-4d99-9609-3819bffa4419",

              "MenuIcon": "icon-arrow-right",

              "IsChargeableMenu": "false",

              "MenuUUID": "02c04e3e-15e1-4570-b01e-382b3e755813",

              "IsInternalMenu": "false",

              "MenuTooltip": "View Roles"

            }

          ],

          "MenuTooltip": "Roles"

        },

        {

          "MenuName": "Menus",

          "MenuLink": "/generalsettings/menus",

          "MenuParentId": "a1152c48-9617-4fcf-9df0-b62dc4ee05f4",

          "MenuIcon": "icon-plus",

          "IsChargeableMenu": "false",

          "MenuUUID": "884975e8-0ffc-4224-bedf-7c47af0f5d0d",

          "IsInternalMenu": "false",

          "ChildMenus": [

            {

              "MenuName": "Create",

              "MenuLink": "/generalsettings/menus/add-menus",

              "MenuParentId": "884975e8-0ffc-4224-bedf-7c47af0f5d0d",

              "MenuIcon": "icon-arrow-right",

              "IsChargeableMenu": "false",

              "MenuUUID": "7c44b909-fa5b-4a8d-b351-1b1dc3969669",

              "IsInternalMenu": "false",

              "MenuTooltip": "Create Menu"

            },

            {

              "MenuName": "View",

              "MenuLink": "/generalsettings/menus/view-menus",

              "MenuParentId": "884975e8-0ffc-4224-bedf-7c47af0f5d0d",

              "MenuIcon": "icon-arrow-right",

              "IsChargeableMenu": "false",

              "MenuUUID": "5afa0c62-9d86-4a0f-a059-ec73025a2ecf",

              "IsInternalMenu": "false",

              "MenuTooltip": "View Menus"

            }

          ],

          "MenuTooltip": "Menus"

        },

        {

          "MenuName": "Pages",

          "MenuLink": "/generalsettings/pages",

          "MenuParentId": "a1152c48-9617-4fcf-9df0-b62dc4ee05f4",

          "MenuIcon": "icon-plus",

          "IsChargeableMenu": "false",

          "MenuUUID": "f17c9440-6dc0-40d4-88a2-fb18b2fbae43",

          "IsInternalMenu": "false",

          "ChildMenus": [

            {

              "MenuName": "Create",

              "MenuLink": "/generalsettings/pages/add-pages",

              "MenuParentId": "f17c9440-6dc0-40d4-88a2-fb18b2fbae43",

              "MenuIcon": "icon-arrow-right",

              "IsChargeableMenu": "false",

              "MenuUUID": "a5657362-e31c-4059-8bde-bf235883881f",

              "IsInternalMenu": "true",

              "MenuTooltip": "Create Pages"

            },

            {

              "MenuName": "View",

              "MenuLink": "/generalsettings/pages/view-pages",

              "MenuParentId": "f17c9440-6dc0-40d4-88a2-fb18b2fbae43",

              "MenuIcon": "icon-arrow-right",

              "IsChargeableMenu": "false",

              "MenuUUID": "152c1208-5f71-44be-ac4a-b824bf9651dd",

              "IsInternalMenu": "false",

              "MenuTooltip": "View Pages"

            }

          ],

          "MenuTooltip": "Pages"

        }

      ],

      "MenuTooltip": "General Settings"

    }

  ]

}

Now Declaire Variable that store value 

public IsInternalMenu = [];

Now Called api and convert and find data "IsInternalMenu" is "true"

data.forEach(x => {
        this.loadchild(x);
  })

Now write Defination of "loadchild" method

 loadchild(item) {
    if (item.IsInternalMenu == 'true') {
      this.IsInternalMenu.push(item);
    }
    if (item.ChildMenus) {
      item.ChildMenus.forEach(element => {
        if (element.IsInternalMenu == 'true') {
          this.IsInternalMenu.push(element);
        }
        if (element.ChildMenus) {
          this.loadchild(element);
        }
      });
    }
  }

so that's the way (recursive method) that help to find n'th level of child data match
to perticular condition and fetch data and store into seprate variable



No comments:

Post a Comment

Thank You For Your Great Contribution

Featured Post

how to find n number of nodes have child or cildren

 how to find n number of nodes have child or cildren for that we use recursive function  const   data = {     'id' : '0' ,...

Popular Posts