Looping nested Json data in NodeJS

Question

In my mockdata I was able to loop through some data for the most part. When you get to students within upcoming you can see that I nested some data. The issue I am having is being able to print that nested data.

{
  "upcoming": [{
    "id": 1,
    "date": "Feb 2nd, 2018",
    "time": "2 to 4pm",
    "status":"$45",
    "course": "Oil Painting",
    "course_type": "(Individual)",
    "student":[
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      }
    ]
  },{
    "id": 2,
    "date": "Feb 2nd, 2018",
    "time": "2 to 4pm",
    "status":"$45",
    "course": "Oil Painting",
    "course_type": "(Group)",
    "student":[
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      },
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      },
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      }
    ]
  },{
    "id": 2,
    "date": "Feb 2nd, 2018",
    "time": "2 to 4pm",
    "status":"$45",
    "course": "Oil Painting",
    "course_type": "(Group)",
    "student":[
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      },
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      },
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      }
    ]
  }],
  "future":[{
    "id": 1,
    "date": "Feb 2nd, 2018",
    "time": "2 to 4pm",
    "status":"$45",
    "course": "Oil Painting",
    "course_type": "(Group)",
    "student":[
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      },
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      },
      {
        "name": "Ann Perkins",
        "image": "/img/student-icon.png"
      }
    ]
  }]
}

I am able to print the date, status, and course into my ejs template, but when I try to display the students images I get an error saying it is undefined.

<% data.upcoming.forEach((record) => { %>
    <tr>
      <td><%=record.date%>
          <span style="display: block;font-size:10pt;">3 to 4pm</span>
      </td>
      <td>Recieved
        <span style="display:block; font-size: 16pt; color:#7c0000;"><%=record.status%></span>
      </td>
      <td><%=record.course%>
        <span style="display:block;font-size:10pt;"><%=record.course_type%></span>
      </td>
      <td>
        LOOK HERE
        <% data.upcoming.student.forEach((person) => { %>
          <img rel="tooltip" data-placement="top" title="Ann Perkins" src="<%=person.image%>">
        <% }) %>
      </td>
    <% }) %>

Am I using the right method to get the array of objects within students?

baao · Accepted Answer · 2018-04-05 18:58:43Z

2

You need to replace data.upcoming.student.forEach((person) => { with record.student.forEach(...)

The student array lies within the array that you are looping above in the ejs template's first line

edited Apr 5, 2018 at 18:58

answered Apr 5, 2018 at 18:54

baao

73.5k18 gold badges152 silver badges208 bronze badges

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

1 Comment

dutchkillsg Over a year ago

Thank you for noticing. I did not see that whatsoever

Collectives™ on Stack Overflow

Looping nested Json data in NodeJS

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related