How do I show the value of an array that has another array inside?

Question

How do I loop through this array and how do I display this roleName value want to loop through it with map

{ 
   "userMenuDTO": {    
        "menuId": "13",
        "menuName":"PruebaMenu900-13",
        "menuRoute":"/path/ruta900-13",
        "menuParentId":null,
         "menuDinamico": true,
        "menuEnabled": false,
        "menuPosition": 900,
        "menuIcono":"pruebaIcono",
        "roles": [
            {
                "roleId": 1,
                "roleName": "CO-MOCA-ADMIN",
                "roleType": 1
            },
             {
                "roleId": 2
                
            }
        ]
    }
}

its an object. all you have to do is obj.userMenuDTO.roles.map(item => <p> {item.roleName} </p>) — Sujit.Warrier
– Sujit.Warrier, Commented Sep 26, 2020 at 3:25
you'd loop through x.userMenuDTO.roles - where x is the name of the variable that object is in ... by the way, there is only a single array, there's no array inside another array in the data you posted — Jaromanda X
– Jaromanda X, Commented Sep 26, 2020 at 3:26

Dharman · Accepted Answer · 2020-09-26 13:13:51Z

1

I see this JSON object has roles array inside this and you can directly access the roles array.

You can you mapper in this case and extract role names into new array and use it, just one of many ways to do this.

var userData = {
  "userMenuDTO": {
    "menuId": "13",
    "menuName": "PruebaMenu900-13",
    "menuRoute": "/path/ruta900-13",
    "menuParentId": null,
    "menuDinamico": true,
    "menuEnabled": false,
    "menuPosition": 900,
    "menuIcono": "pruebaIcono",
    "roles": [{
        "roleId": 1,
        "roleName": "CO-MOCA-ADMIN-1",
        "roleType": 1
      },
      {
        "roleId": 2,
        "roleName": "CO-MOCA-ADMIN-2",
        "roleType": 2
      },

      {
        "roleId": 3,
        "roleName": "CO-MOCA-ADMIN-3",
        "roleType": 3
      }
    ]
  }
};

var rollNamesArr = userData.userMenuDTO.roles.map(function(role) {
    return role.roleName;
});

console.log(rollNamesArr);

edited Sep 26, 2020 at 13:13

Dharman♦

33.9k27 gold badges106 silver badges157 bronze badges

answered Sep 26, 2020 at 4:38

harishprodduturi

462 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sarun UK · Accepted Answer · 2020-09-26 06:41:57Z

0

For the iteration, you can use forEach and map

const {roles} = userData.userMenuDTO; // Object destructuring

// forEach won't return any result so that we have to push to an array.
const result = [];
roles.forEach(role => result.push(role.roleName)); // using arrow function here
console.log(result);

// Map will return result as array. (more preferable approach)
var rollNamesArr = roles.map(role => role.roleName);
console.log(rollNamesArr);

answered Sep 26, 2020 at 6:41

Sarun UK

6,7667 gold badges26 silver badges51 bronze badges

Collectives™ on Stack Overflow

How do I show the value of an array that has another array inside?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related