CODEWITHSUNDEEP
javascriptjsonnode.jsejs
dutchkillsg
dutchkillsg

Reputation: 373

Looping nested Json data in NodeJS

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?

Upvotes: 0

Views: 47

Answers (1)

baao
baao

Reputation: 73251

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

Upvotes: 2

Related Questions