CODEWITHSUNDEEP
node.jspug
William
William

Reputation: 4578

How to use HTML syntax in jade templates

I want to focus on learning how to build things in node without having to fiddle about with the jade syntax. I want to know if its possible to blend native html syntax in jade templates along with its looping syntax etc.If so how. If not, is there a template engine for node that will allow this.

Thank you.

Upvotes: 2

Views: 2122

Answers (1)

ztirom
ztirom

Reputation: 4438

For sure you can blend plain HTML and Jade code, just use Piped Text.
For example:

| <a href="#">Plain HTML</a>

Here an example from the Jade Online Demo (actually great to play around with and test some sort of things!):

doctype html
html(lang="en")
  head
    title= pageTitle
    script(type='text/javascript').
      if (foo) {
         bar(1 + 5)
      }
  body
    h1 Jade - node template engine
    #container.col
      if youAreUsingJade
        p You are amazing
      else
        p Get on it!
      p.
        Jade is a terse and simple
        templating language with a
        strong focus on performance
        and powerful features.
    | <a href="#">Plain HTML</a>

with this test data:

{
  pageTitle: 'Jade Demo',
  youAreUsingJade: true
}

generates this code:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Jade Demo</title>
    <script type="text/javascript">
      if (foo) {
         bar(1 + 5)
      }
    </script>
  </head>
  <body>
    <h1>Jade - node template engine</h1>
    <div id="container" class="col">
      <p>You are amazing</p>
      <p>
        Jade is a terse and simple
        templating language with a
        strong focus on performance
        and powerful features.
      </p>
    </div><a href="#">Plain HTML</a>
  </body>
</html>

Upvotes: 2

Related Questions