Handlebars Conditionals

Sometimes we might want to format data based on certain conditions. For example, if an email address or URL exists for a person, we might want to include a mailto: link or a link to the URL. Handlebar conditionals allow to do that.

People in JSON:

{
    "people": [
        {
            "name": "Lawrence Bacow",
            "url": "http://president.harvard.edu/"
        },
        {
            "name": "Alan Garber",
            "url": "http://provost.harvard.edu/people/alan-m-garber"
        },
        {
            "name": "Katie Lapp"
        }
    ]
};

For example, if we wanted to hyperlink a name if a URL exists, our Handlebars template could look something like:

<ul>
{{#each people as |person|}}
  <li>
  {{#if person.url }}
    <a href="{{person.url}}">{{person.name}}</a>
  {{else}}
    {{person.name}}
  {{/if}}
  </li>
{{/each}}
</ul>

And this would produce: