Fetch array of object values using angular and typescript

Question

I am trying to get the array of object values into the array using nested for loop. I am getting the json data as below. For that i have written the typescript code as below. But i am not able to get the desired results to bind the values to template. See below my code.

This is my typescript code:

let totalData = results['data'];
     for (var i=0; i<totalData.length; i++)
        for (var task in totalData[i]) {
            console.log("Task: "+task);
            console.log("totalTests: "+task['totalTestCompleted']);
            console.log("totalOpenIssues: "+totalData[i][task].totalOpenIssues);
        }

The below is the json data i am getting from the rest api.

   [
    {  
          "id":"8a8080f06610359c0166103cf22c7032",
          "createdDate":"2018-09-25T10:18:41.580+0000",
          "inactive":false,
          "job":{  
             "id":"8a80809465ebb03f0165ebf9a780009b",
             "createdDate":"2018-09-18T09:18:51.775+0000",
             "inactive":false,
             "project":{  
                "id":"8a8080a565e5c6f90165e5dc7d950089",
                "createdDate":"2018-09-17T04:49:17.205+0000",
                "inactive":false,
                "name":"testproject917",
                "org":{  
                   "id":"8a8080cf65e02c0f0165e031fb9e0003",
                   "createdBy":"anonymousUser",
                   "createdDate":"2018-09-16T02:24:56.734+0000",
                   "inactive":false,
                   "name":"Google"
                }
             },
             "name":"prod",
             "refId":"prod",
             "description":null,
             "environment":{  
                "id":"8a80809465ebb03f0165ebf9a779009a",
                "createdDate":"2018-09-18T09:18:51.769+0000",
                "inactive":false,
                "baseUrl":" http://www.google.com",
                "auths":[  
                   {  
                      "name":"prodenv",
                      "authType":"Basic",
                      "username":"Google//admin@google.io",
                      "password":"4+Coma/w5kOSlofdJLeBT6b4tdGNrVbE"
                   }
                ]
             },
             "issueTracker":{  
                "id":"8a80809465ebb03f0165ebf9a780009c",
                "name":"Dev-IssueTracker"
             },
             "notifications":[  
                {  
                   "id":12,
                   "name":"Dev-Email-Notification"
                },
                {  
                   "id":null,
                   "name":"Default_Slack"
                }
             ],
             "categories":"",
             "notificationToDo":false,
             "issueTrackerToDo":false,
             "openIssues":0,
             "closedIssues":0
          },
          "runId":9,
          "task":{  
             "name":"Tue Sep 25 10:18:41 UTC 2018",
             "description":"Invalid Region: US_WEST_1",
             "status":"FAIL",
             "totalTests":0,
             "totalOpenIssues":0
          },
          "attributes":{  
             "REGION":"US_WEST_1"
          },
          "regions":"US_WEST_1",
          "stats":{  

          },
          "validations":null,
          "ciCdStatus":"FAIL:Invalid Region: US_WEST_1FAIL:0.0:0:0:"
       },
       {}
       ]

I am trying to get the key and values of task object as below

task.totalTests
task.totalOpenIssues

When i am trying to get the json array of object values then i am getting this error:

ERROR TypeError: Cannot read property 'totalTestCompleted' of null

So my idea is to bind those values to template. For that i have written the everyting but i am not able to get the array of json object values. Can anyone help me on this?

Thanks.

Answer 1

There are some problems on your code. According to the data you show, you don't need nested loops. Also, there's no totalTestCompleted key anywhere in your data.

let totalData = results['data'];
for (var i=0; i<totalData.length; i++) {
    // totalTestCompleted doesn't exist: console.log("totalTests: "+task.totalTestCompleted);
    console.log("totalOpenIssues: "+ totalData[i].task.totalOpenIssues);
}

Answer 2

Not all your elements contains the task information so you need to check for it.

for (var key in totalData) {
  console.log('Task id: ' + key);
  // You have an empty item in the end
  if (totalData[key].task) {
        console.log('Total tests: ' + totalData[key].task.totalTests);
    console.log('Total open issues: ' + totalData[key].task.totalOpenIssues);
  }
  else {
    console.log('No task');
  }
}

Just another note, for (var task in totalData[i]) will return every key of the object:

var o = { a: 1, b: 2 };
for (var k in o) {
  console.log('Key: ' + k);
}

// The above will log
Key: a
Key: b

The way you were using it you got all the keys:

id
createdDate
inactive
job
and so on...