How to access data in JSON response in Angular 8?

Question

I am getting data back from a web-server and I am trying to access the data within the JSON object. I am having some issues with accessing it.

The JSON looks like this:

{
     "faults": [
      {
        "FaultCodeType": "X",
        "ErrorType": "System",
        "Description": "Response failed for reason 1"
      },
      {
        "FaultCodeType": "Y",
        "ErrorType": "System",
        "Description": "Response failed for reason 2"
      }
     ],
     "responseInfo": {},
     "responseInfo2": {},
     "responseInfo3": {}
}

Should I use JSON.parse?

JSON.stringify?

I have the method:

loadData(dataPassed) {
  this.angularService.searchWithData(dataPassed).subscribe(
data => {
const fault = data[0];
const fault2 = data[1];
console.log('Data is here = ' + data); // returns the JSON
console.log('Request = ' + JSON.stringify(data)); // shows the JSON
console.log(fault);  // undefined
console.log(fault2); // undefined
  }
}

It is not working though, any help would be greatly appreciated.

The data when I console.log() is coming back as undefined. If I console.log the whole response (data) all I get is object Object. — user3019183
– user3019183, Commented Apr 14, 2020 at 12:30

Shlok Nangia · Accepted Answer · 2020-04-14 12:41:04Z

1

You are getting undefined because of

const fault = data[0];
const fault2 = data[1];

as your data is object not array therefore fault[0] does not exists

try

const fault = data.faults[0];
const fault2 = data.faults[1];

answered Apr 14, 2020 at 12:41

Shlok Nangia

2,3773 gold badges19 silver badges25 bronze badges

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

Comments

Abdulrahman Hashem · Accepted Answer · 2020-04-14 12:48:32Z

1

To access faults:

const faults = data.faults;

Then you can iterate over those faults:

faults.forEach(f -> {
     console.log('f.FaultCodeType', f.FaultCodeType);
     console.log('f.ErrorType', f.ErrorType);
     console.log('f.Description', f.Description);
})

To access responseInfo, responseInfo2 or responseInfo3:

console.log('data.responseInfo', data.responseInfo);
console.log('data.responseInfo2', data.responseInfo2);
console.log('data.responseInfo3', data.responseInfo3);

answered Apr 14, 2020 at 12:48

Abdulrahman Hashem

1,9991 gold badge20 silver badges22 bronze badges

Collectives™ on Stack Overflow

How to access data in JSON response in Angular 8?

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