pasindu229
pasindu229

Reputation: 27

How to create a table using data coming from database using handlebars?

Im trying to make a table in handlebars using data coming from database. I used following code but it won't work.

 <h1>Employees</h1>
<div class="row">
  <table>
    <thead>
      <tr>
        <th>ID</th>
        <th>Name</th>
        <th>Department</th>
      </tr>
    </thead>
        <tbody>
        {{#each employees}}
                <tr>
                    <td>{{employees.id}}</td>
                    <td>{{employees.name}}</td>
                    <td>{{employees.department}}</td>
                </tr>
        {{else}}
        <p>No employees to display</p>
        {{/each}}
        </tbody>
    </table>
</div>

I passed data to template like following. Data is there when i console log it.

  router.get('/employees',async (req, res) => {
  try {
    const employees = await Employee.find()
      .sort({ _id: 'desc' })
      .lean()
    console.log(employees);
    res.render('stories/index', {
      employees,
    })
  } catch (err) {
    console.error(err)
    res.render('error/500')
  }
})

Upvotes: 0

Views: 613

Answers (1)

MattB
MattB

Reputation: 1104

When you are using Handlebars, you shouldn't provide the collection name when referencing the properties:

<tbody>
  {{#each employees}}
  <tr>
    <td>{{id}}</td>
    <td>{{name}}</td>
    <td>{{department}}</td>
  </tr>
  {{else}}
    <p>No employees to display</p>
  {{/each}}
</tbody>

Upvotes: 1

Related Questions