onmyway onmyway - 6 months ago 23
AngularJS Question

Loop through Array of Objects within Objects in JavaScript

I hope you guys can help me.

First off, I know much has been said and written on this subject, and I have been reading up and trying various solutions for the last couple hours, but there is something I am missing.

I also believe it will possibly be a very simple task, so I apologize in advance for my ignorance.

How do I loop though an Array of Objects within Objects in JavaScript?

I have read one should use a for...in loop for arrays, but a simple for loop for objects, but exactly how to loop through and array of objects within object, eludes me.

This is what I am trying to achieve:

I want to display a list of reports (report name) in my UI that matches a specific ReportTemplateTypeId.

To do this, I am trying to loop through my retrieved data (after my data call), to build such a list to display.

The report names I want to display must have a ReportTemplateTypeId == 1

My Retrieved data looks like this: SelectableReportTemplateNames: [{{}},{{}},{{}},{{}}] with an Object within an Object within an Array.

Here is an actual example of the data, with 4 records I would like add to my list:

"SelectableReportTemplateNames": [
{
"ReportTemplateId": 1,
"ReportTemplateName": "Proof of Receipt",
"ReportTemplatePath": "...rdlc",
"ReportTemplateType": {
"ReportTemplateTypeId": 2,
"ReportTemplateTypeDescription": "Inventory - Proof of Receipt",
"Id": null
},
"Id": "5653781274d4f23d4cbb54b8"
},
{
"ReportTemplateId": 2,
"ReportTemplateName": "Proof of Transfer",
"ReportTemplatePath": ".....rdlc",
"ReportTemplateType": {
"ReportTemplateTypeId": 3,
"ReportTemplateTypeDescription": "Inventory - Proof of Transfer",
"Id": null
},
"Id": "5653781274d4f23d4cbb54b9"
},
{
"ReportTemplateId": 11,
"ReportTemplateName": "All Calls Report",
"ReportTemplatePath": "....rdlc",
"ReportTemplateType": {
"ReportTemplateTypeId": 1,
"ReportTemplateTypeDescription": "All Calls Report",
"Id": null
},
"Id": "5739a89577801d7f0c10254c"
},
{
"ReportTemplateId": 12,
"ReportTemplateName": "High Priority Calls Report",
"ReportTemplatePath": "......rdlc",
"ReportTemplateType": {
"ReportTemplateTypeId": 1,
"ReportTemplateTypeDescription": "High Priority Calls Report",
"Id": null
},
"Id": "5739a89e77801d7f0c10254d"
},
{
"ReportTemplateId": 13,
"ReportTemplateName": "Call Asset Lines Report",
"ReportTemplatePath": "......rdlc",
"ReportTemplateType": {
"ReportTemplateTypeId": 1,
"ReportTemplateTypeDescription": "Call Asset Lines Report",
"Id": null
},
"Id": "5739aa7d77801d7f0c10254e"
},
{
"ReportTemplateId": 16,
"ReportTemplateName": "Daily Status Report",
"ReportTemplatePath": ".....rdlc",
"ReportTemplateType": {
"ReportTemplateTypeId": 1,
"ReportTemplateTypeDescription": "Daily Status Report",
"Id": null
},
"Id": "5739abb077801d7f0c102552"
}
],


I thank you greatly in advance!

Answer

You can iterate through it with Array#forEach

var object = { "SelectableReportTemplateNames": [{ "ReportTemplateId": 1, "ReportTemplateName": "Proof of Receipt", "ReportTemplatePath": "...rdlc", "ReportTemplateType": { "ReportTemplateTypeId": 2, "ReportTemplateTypeDescription": "Inventory - Proof of Receipt", "Id": null }, "Id": "5653781274d4f23d4cbb54b8" }, { "ReportTemplateId": 2, "ReportTemplateName": "Proof of Transfer", "ReportTemplatePath": ".....rdlc", "ReportTemplateType": { "ReportTemplateTypeId": 3, "ReportTemplateTypeDescription": "Inventory - Proof of Transfer", "Id": null }, "Id": "5653781274d4f23d4cbb54b9" }, { "ReportTemplateId": 11, "ReportTemplateName": "All Calls Report", "ReportTemplatePath": "....rdlc", "ReportTemplateType": { "ReportTemplateTypeId": 1, "ReportTemplateTypeDescription": "All Calls Report", "Id": null }, "Id": "5739a89577801d7f0c10254c" }, { "ReportTemplateId": 12, "ReportTemplateName": "High Priority Calls Report", "ReportTemplatePath": "......rdlc", "ReportTemplateType": { "ReportTemplateTypeId": 1, "ReportTemplateTypeDescription": "High Priority Calls Report", "Id": null }, "Id": "5739a89e77801d7f0c10254d" }, { "ReportTemplateId": 13, "ReportTemplateName": "Call Asset Lines Report", "ReportTemplatePath": "......rdlc", "ReportTemplateType": { "ReportTemplateTypeId": 1, "ReportTemplateTypeDescription": "Call Asset Lines Report", "Id": null }, "Id": "5739aa7d77801d7f0c10254e" }, { "ReportTemplateId": 16, "ReportTemplateName": "Daily Status Report", "ReportTemplatePath": ".....rdlc", "ReportTemplateType": { "ReportTemplateTypeId": 1, "ReportTemplateTypeDescription": "Daily Status Report", "Id": null }, "Id": "5739abb077801d7f0c102552" }] };

object.SelectableReportTemplateNames.forEach(function (a) {
    if (a.ReportTemplateType.ReportTemplateTypeId === 1) {
        document.write(a.ReportTemplateName + '<br>');
    }
});