Hogan JS IF statements

Question

I don't really like the jade syntax and was wondering if I could do this simple comparison using hoganJS instead?

The example code is written in JADE.

I did some googling and there seems to be mixed opinion.. I just want to know if there is a way or will I need to change something?

if user
 li
   a(href='/dashboard') Dashbaord
 li
   a(href='/logout') Logout
else
 li
   a(href='/login') Logi§n

block body

Bly

Answer 1

Hogan is an implementation of Mustache so the same syntax applies.

{{#user}}
  <li><a href="/dashboard">Dashboard</a></li>
  <li><a href="/logout">Logout</a></li>
{{/user}}
{{^user}}
  <li><a href="/login">Login</a></li>
{{/user}}

PS I used to debate whether to use Hogan or some other Mustache implementation over Handlebars because it was little faster/lighter. My advice is to use Handlebars not Hogan, and compile your front end and only use Handlebars runtime on build - because it has nicer conditional syntax and supports a few more useful things without going too over the top.

In Handlebars it would be the cleaner:

{{#if user}}
...
{{else}}
...
{{/if}

But anyway Hogan is still nice, so your choice. I also don't like Jade it reminds me of CoffeeScript or something.

Scorpaenid

Cheers mate, I had actually completely forgotten about handlebars. Cheers for all the help! :) – Bly

just another quick question can hogan templates inherit from one another? – Bly

@Bly yes you can, the syntax is like {{> myPartialName}} not exactly sure the default path to them. There is also a second param to the render method which can take partials as an option but I think that is optional - docs are a little vague: twitter.github.io/hogan.js. Try just adding one and you might get an error that will tell you where it expected the partial to be located. – Scorpaenid

@DominicTobias This answer helped me a lot, thanks man. I take it {{#user}} is equivalent to {{#if user}} and {{^user}} is equivalent to {{else}}? – Inflection

@Wade np! yep pretty much, actually literally speaking the Mustache one is if (user) { ..stuff.. } if (!user) {..stuff..} - but it's the equivalent of an else, just more verbose – Scorpaenid