Angualar - change object into array with specific structure

Question

Good morning, could someone help me with changing Object like this

    {
    item1: "this is string field value",
    item2: "FF FF A2 C4h"
    }

And i need to get this format of array

[
 {
  id: item1, value: "this is string field value"
 },
 {
  id: item2, value: "FF FF A2 C4"
 }
]

I know how I could solve this, for example, using it Object.keys() or Object.values().

But I always get only one parameter out of two. And then the combination of these two results I am not able to put together. Therefore, I want to ask if anyone knows about a better / simpler solution. Or if someone could show me what I'm doing wrong and what is solution for this.

Thanks in advance

Do you need {id: item1} or {id: "item1"} (string value) ?

Nice Books
– Nice Books

2022-02-13 07:31:48 +00:00
Commented Feb 13, 2022 at 7:31 — Nice Books
– Nice Books, Commented Feb 13, 2022 at 7:31

Siddhant · Accepted Answer · 2022-02-13 07:36:21Z

3

You can use Object.entries() to get hold of both key and value at same time.

From MDN docs:

The Object.entries() method returns an array of a given object's own enumerable string-keyed property [key, value] pairs

Try something as below:

const someArray = Object.entries(someObject).map(([key, value]) => ({id: key, value: value}))

answered Feb 13, 2022 at 7:36

Siddhant

3,2112 gold badges10 silver badges15 bronze badges

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

1 Comment

Daniel Vágner Over a year ago

Amazing thats what i need. I completely forgot about Object.entries () and how to use it in this case. Thank you.

Yong Shun · Accepted Answer · 2022-02-13 07:38:35Z

0

With Object.keys(), you can work as below:

let input = {
    item1: "this is string field value",
    item2: "FF FF A2 C4h"
};

let result: {id: string, value: string}[] = [];

Object.keys(input).forEach(function(k) {
    let key = k as keyof typeof input;
    result.push({
        id: k,
        value: input[key]
    });
});

Sample Typescript Playground

answered Feb 13, 2022 at 7:38

Yong Shun

54.6k6 gold badges38 silver badges66 bronze badges

Collectives™ on Stack Overflow

Angualar - change object into array with specific structure

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related