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:
Create
index.html
containing the CSS style, placeholder, and the templatescript
element:<!DOCTYPE HTML> <html> <head> <title>Rendering an array with EJS</title> <style type="text/css"> .message { border-bottom:solid 1px #ccc; width: 250px; padding: 5px; } .message p { margin: 0.5em 0; } .message...