O'Reilly logo

HTML5 Data and Services Cookbook by Mite Mitreski, Gorgi Kosev

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Rendering arrays using Jade

Jade also supports rendering lists of items as other template languages. We can use the each construct to iterate through the elements in the array and output some HTML elements for each.

In this recipe, we're going to render a list of message objects. Each message object will have an author, arrival time, body, and read status. We're going to use a different style to distinguish between read and unread messages.

We're also going to use different backgrounds for odd and even rows.

Getting ready

We need to download jade.min.js in to our recipe folder available at https://github.com/visionmedia/jade.

How to do it...

Follow these steps:

  1. Create index.html containing the CSS style, placeholder, and the template script element: ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required