A guide to accessing a property value in Angular 6 from an object using a string key

Question

A guide to accessing a property value in Angular 6 from an object using a string key

In my Angular application, I am receiving an object with multiple arrays from a REST service.

I need to access the value from the incoming object based on the property name.

Here is what the object looks like:

data{
array1:{},
array2:{},
array3:{}
}

The number of arrays and their names can vary. I have another array containing all these array names like...

arraynames = {array1,array2,array3}

I have attempted to retrieve the value using...

data[arraynames[0]]
or
data[0]
or 
data[array1]

However, none of these methods seem to be working as they are returning undefined.

Is there a way for me to successfully retrieve the value of an array from data?

javascript angular typescript

Answer 1

Answer №1

One way to access the data is by using:

Object.values(info)[0];
//or
info.array1

Answer 2

One way to access the data is by using:

Object.values(info)[0];
//or
info.array1

Answer 3

Answer №2

For your array to function correctly, it must be a string array in the following format: arrayNames = ['array1', 'array2', 'array3']. This way, you can access the data using data[arrayNames[0]].

Answer 4

For your array to function correctly, it must be a string array in the following format: arrayNames = ['array1', 'array2', 'array3']. This way, you can access the data using data[arrayNames[0]].

Answer 5

Answer №3

Give it a shot:

class MainComponent {
  list = {
    item1: {id:1},
    item2: {id:2},
    item3: {id:3}
  }

  items = ["item1", "item2", "item3"]

  constructor() {
    this.items.forEach(element => {
      console.log(this.list[element])
    });
  }
}

Answer 6

Give it a shot:

class MainComponent {
  list = {
    item1: {id:1},
    item2: {id:2},
    item3: {id:3}
  }

  items = ["item1", "item2", "item3"]

  constructor() {
    this.items.forEach(element => {
      console.log(this.list[element])
    });
  }
}

A guide to accessing a property value in Angular 6 from an object using a string key

Answer №1

Answer №2

Answer №3

Similar questions

The impact of Ajax on jQuery document loading within an Ajax form

Tips for customizing your MUI slider design

modifying variable values does not impact what is displayed on the screen

Retrieving template variable within a directive's host listener function

Raycast in Three.js is struggling to locate object

Steps to send an asynchronous AJAX request to the server-side within the JQuery validation plugin using the addMethod() function

Displaying array elements on a webpage using JavaScript in HTML

Once the "Get Route" button is pressed, I want to save my JavaScript variable into a database

Utilizing ng-class to manipulate arrays in AngularJS

Redis Recursion: The callstack has reached its maximum size limit

Step-by-step guide on populating input fields with JSON data for each row

Troubleshooting the issue with the htmlFor attribute

Ensuring various conditions with ngIf

Executing Passport.js for Authentication

What is causing the button within my ExtJS grid to display as "[object Object]"?

Send the form data from a modal controller in AngularJS to an ng-controller outside of the modal

Assigning the output of a function to an Angular2 component (written in TypeScript)

Eliminate spaces within a string using JavaScript

SvelteKit is having trouble with identifying Typescript syntax

JavaScript - Capture the Values of Input Fields Upon Enter Key Press