Is there a way to offset the 'each' iteration when using the Jade template engine?
for example, when passing in the object named list:
ul
each item in list
li #{item}
Will output
<ul>
<li> Item 1 </li>
<li> item 2 </li>
<li> item 3.....
...
</ul>
But I want the first item to be displayed differently than the rest of the items, like so:
<ul>
<li> Item 1: First Item in list! </li>
<li> item 2 </li>
<li> item 3.....
...
</ul>
So does anyone know a way to offset the 'each' statement in Jade so that I can render the first item separately and then render each following item starting at the 2nd index?
Jade is a template engine for node. js and the default rendering engine for the Express web framework. It is a new, simplified language that compiles into HTML and is extremely useful for web developers. Jade is designed primarily for server-side templating in node.
It's used to produce XML documents like (HTML, RSS etc.), so we can't use it to create the plain text like HTML/CSS other documents. Jade Template Engine is used to make the template more beautiful and more meaningful with the help of description and their layout.
Jade is a template engine for Node. js. Jade syntax is easy to learn. It uses whitespace and indentation as a part of the syntax.
The difference between ejs and jade is that ejs' purpose is to directly add javascript logic and import values to strings of html; Jade is a full templating language with its own syntax. In the end, both compile a template into a javascript function which then glues together the resulting snippets into html.
each item, i in list
li= item
if i === 1
| : First item in list!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With