Angular 2 get key and value from json array with dynamic key

Question

I want to get key and value from json array with dynamic keys. Meaning, I don't know in advance what will be the keys.

This is an example to the json the function gets:

arr = [
       {key1: 'val1'},
       {key2: 'val2'},
       {key3: 'val3'}
      ];

It seems simple to me but I am unable to get the key and value for each item.

This is what I tried (based on this pipe):

for (let key of arr) {
   console.log ('key: ' +  key + ',  value: ' + arr[key]);
 }

But what I get in the log is the following:

key:[object Object], value: undefined

My expected behavior is to get the following:

key:key1, value:val1

What am I doing wrong? How can I get the keys and values?

for...of returns items (values) in array/object. for...in returns keys in array/object. so you need one more inner loop with for...in to get keys for each item. — tlt
– tlt, Commented Jul 30, 2017 at 10:35

Hendrik Brummermann · Accepted Answer · 2017-07-30 10:35:40Z

20

In your example, you have an array of objects and each of these object has exactly one property.

for (let obj of arr) {
    console.log("object:", obj);
    for (let key in obj) {
        console.log("      key:", key, "value:", obj[key]);
    }
}

The following code from your posting

for (let key in arr) {
    console.log ('key: ' +  key + ',  value: ' + arr[key]);
}

... would work on a data structure like this:

let arr = {
    key1: 'val1',
    key2: 'val2',
    key3: 'val3'
};

answered Jul 30, 2017 at 10:35

Hendrik Brummermann

8,3403 gold badges34 silver badges55 bronze badges

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

Comments

CodeChanger · Accepted Answer · 2019-01-02 10:54:40Z

5

If you are more concerned to specify object like

var temp={'name':Dinesh,'age':18}

You may use following syntax.

console.log(Object.keys(temp)[0],Object.values(temp)[0]):

Specially zero index because object's both method keys and values return an array

edited Jan 2, 2019 at 10:54

CodeChanger

8,4215 gold badges52 silver badges87 bronze badges

answered Jul 10, 2018 at 18:06

Sachin Mishra

1,1931 gold badge16 silver badges17 bronze badges

Comments

Sajeetharan · Accepted Answer · 2017-07-30 10:24:53Z

3

You need another for loop to access key and value,

for (let key of this.arr) {
 for(var i in key){
      console.log('key: ' +  i + ',  value: ' + key[i]);
 }
}

Check the console

DEMO

answered Jul 30, 2017 at 10:24

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Comments

reihaneh · Accepted Answer · 2019-01-21 08:00:58Z

0

yourObject.forEach(function(value, index){
   // do your job
   console.log(value, index);
});

edited Jan 21, 2019 at 8:00

answered Jan 16, 2019 at 8:32

reihaneh

274 bronze badges

2 Comments

barbsan Over a year ago

It's bad idea to name variable Object, and even for arr.forEach you'll get current index in key

reihaneh Over a year ago

Thank's dear @barbsan, i applied your advice

bummi · Accepted Answer · 2019-04-30 10:48:26Z

0

You can try these

object = [
{
  "id": 1,
  "test": "test1",
  "name": ["abc", "pqr"]

},
{
  "id": 2,
  "test": "test2",
  "name": ["abc2", "pqr2"]

},
{
  "id": 3,
  "test": "test3",
  "name": ["abc3", "pqr3"]

},
{
  "id": 4,
  "test": "test4",
  "name": ["abc4", "pqr4"]

}]

and your js or typescript code be like:-

YourMethod() {
for (let item of this.object) {
  for (let i in item) {
    if (typeof (item[i]) === 'object') {
      item[i].forEach((e: any) => {
        console.log("runseprate", e)
      })
    }
  }
}}

edited Apr 30, 2019 at 10:48

bummi

27.4k14 gold badges67 silver badges105 bronze badges

answered Apr 30, 2019 at 10:41

digvijay deshmukh

11 bronze badge

Comments

Techdive · Accepted Answer · 2019-09-12 09:27:09Z

0

   json = {payload.InsuredMobileNumber.type: "string"
payload.accidentTime.type: "string"
payload.causeOfLoss.type: "string"
payload.claimRegistrationDate.type: "string"
payload.emailAddress.type: "string"}


 var keyData = Object.keys(json);
          var valueData = Object.values(json)
          console.log("keyData = ", keyData)
          console.log("valueData = ", valueData)

answered Sep 12, 2019 at 9:27

Techdive

1,0533 gold badges26 silver badges55 bronze badges

Collectives™ on Stack Overflow

Angular 2 get key and value from json array with dynamic key

6 Answers 6

Comments

Comments

Comments

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related