Skip to content

Using loops

Passing an array

It is a very common scenario to pass an array of objects to our template.

js
app.get('/bleets', async (req, res) => {
  const bleets = await Bleet.findAll() // bleets is an array
  res.render('bleets', { bleets })
})

This renders the bleets.ejs template with access to the array of bleets from the database.

Rendering lists

In our view, we can use EJS to render the list using a for/of loop.

html
<ol>
  <% for (let bleet of bleets) { %>
  <li>
    <%= bleet.content.slice(0, 10) + '...' %>
    <a href="<%= `/bleets/${bleet.id}` %>">Read more</a>
  </li>
  <% } %>
</ol>

TIP

It is not necessary to use <ol> or <ul> when rendering lists - you can use this looping pattern to render any html you like.

INFO

The <% %> tags interpolate javascript into the template without displaying anything in the view. This is often used to start and end loops, or to do conditional rendering such as

html
<% if (condition) { %>
<p>Condition is true!</p>
<% } else { %>
<p>Condition is false!</p>
<% } %>