Transforming an array of JSON items into a unified object using Angular

Question

Transforming an array of JSON items into a unified object using Angular

I need to convert an array list into a single object with specific values using TypeScript in Angular 8. Here is the array:

"arrayList": [{
    "name": "Testname1",
    "value": "abc"
  },
  {
    "name": "Testname2",
    "value": "xyz"
  }
]

The desired format for conversion is as follows:

data: {
  "Testname1": "abc",
  "Testname2": "xyz",
}

Despite my efforts, I keep ending up with a list instead of a single object. Any assistance with achieving the desired outcome would be greatly appreciated.

arrays json angular typescript

Answer 1

Answer №1

Here is an example of how you can achieve this:

 
var array =  [
            {
                "title": "Title1",
                "content": "example1"
            },
            {
                "title": "Title2",
                "content": "example2"
            }
           ];

var finalResult = {};
for (var index = 0; index < array.length; index++) {
  finalResult[array[index].title] = array[index].content;
}

console.log(finalResult);

Answer 2

Here is an example of how you can achieve this:

 
var array =  [
            {
                "title": "Title1",
                "content": "example1"
            },
            {
                "title": "Title2",
                "content": "example2"
            }
           ];

var finalResult = {};
for (var index = 0; index < array.length; index++) {
  finalResult[array[index].title] = array[index].content;
}

console.log(finalResult);

Answer 3

Answer №2

Experiment by utilizing the .reduce() method in the following manner:

const itemsArray = [{ "item": "Item1", "price": "$10" }, { "item": "Item2", "price": "$20" }];

const result = itemsArray.reduce((total, {item, price}) => {
  total[item] = price;
  return total;
}, {});

const finalResult = { result };

console.log(finalResult);

Answer 4

Experiment by utilizing the .reduce() method in the following manner:

const itemsArray = [{ "item": "Item1", "price": "$10" }, { "item": "Item2", "price": "$20" }];

const result = itemsArray.reduce((total, {item, price}) => {
  total[item] = price;
  return total;
}, {});

const finalResult = { result };

console.log(finalResult);

Answer 5

Answer №3

Transform a list of [name, value] entries using Array.map() and then convert it into an object with Object.fromEntries():

const arrayList = [{ "name": "Testname1", "value": "abc" }, { "name": "Testname2", "value": "xyz" }];

const result = Object.fromEntries(arrayList.map(({ name, value }) => [name, value]));

console.log(result);

Answer 6

Transform a list of [name, value] entries using Array.map() and then convert it into an object with Object.fromEntries():

const arrayList = [{ "name": "Testname1", "value": "abc" }, { "name": "Testname2", "value": "xyz" }];

const result = Object.fromEntries(arrayList.map(({ name, value }) => [name, value]));

console.log(result);

Answer 7

Answer №4

Kindly utilize the following code snippet

const initialData = {
  "listItems": [{
      "name": "Item1",
      "id": 123
    },
    {
      "name": "Item2",
      "id": 456
    }
  ]
};

const modifiedData = {
  updated: {}
};

for (const element of initialData["listItems"]) {
  modifiedData.updated[element.name] = element.id;
}

console.log(modifiedData);

Answer 8

Kindly utilize the following code snippet

const initialData = {
  "listItems": [{
      "name": "Item1",
      "id": 123
    },
    {
      "name": "Item2",
      "id": 456
    }
  ]
};

const modifiedData = {
  updated: {}
};

for (const element of initialData["listItems"]) {
  modifiedData.updated[element.name] = element.id;
}

console.log(modifiedData);

Transforming an array of JSON items into a unified object using Angular

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Error: Pointer array causing Segmentation Fault

How can I restrict the return type of a generic method in TypeScript based on the argument type?

Is there a way to convert a Java object into a JSON string while ensuring that all special characters are

Encountering Invalid Chai attribute: 'calledWith'

Analyzing data from Facebook API response (JSON) to extract valuable information

Can you please guide me on retrieving information from an API using HTML, CSS, and JavaScript?

Ways to determine the total amount of existing files in a directory

Using rxjs for exponential backoff strategy

What is causing the warnings for a functional TypeScript multidimensional array?

An error occurs when trying to cast a JSONArray into a java.util.ArrayList

Saving CSV files in Couchbase using JSON formatting

Creating customized object mappings in Typescript

Transforming a JSON string into a Hashie mash object

In TypeScript, the argument 'xxx' cannot be passed to a parameter expecting a 'string' type

Creating the document.ready function in Angular2 with JQuery

Creating a map in Typescript initialized with a JSON object

The 'MutableRefObject<null>' type is lacking the following properties that are present in the 'Element' type

Having trouble retrieving object properties within an Angular HTML template

Jest is having difficulty locating a module while working with Next.js, resulting in

Every time Chrome on Android returns a keyCode of 229