{"category":{"version":"58810495d172b61b00d73859","project":"542fe92a5eceb608003fddc8","_id":"58810495d172b61b00d7385d","__v":0,"sync":{"url":"","isSync":false},"reference":false,"createdAt":"2014-10-04T12:45:40.548Z","from_sync":false,"order":3,"slug":"helper-reference","title":"Helper Reference"},"parentDoc":null,"project":"542fe92a5eceb608003fddc8","user":"542c5cfcddd3190e00228849","version":{"__v":1,"_id":"58810495d172b61b00d73859","project":"542fe92a5eceb608003fddc8","createdAt":"2017-01-19T18:25:25.206Z","releaseDate":"2017-01-19T18:25:25.206Z","categories":["58810495d172b61b00d7385a","58810495d172b61b00d7385b","58810495d172b61b00d7385c","58810495d172b61b00d7385d","58810495d172b61b00d7385e","58810495d172b61b00d7385f"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"0.11.4","version":"0.11.4"},"_id":"58810495d172b61b00d73880","__v":0,"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-04-07T20:12:07.429Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":36,"body":"Usage: `{{#if featured}}{{/if}}`\n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Type\",\n    \"h-1\": \"Parameters\",\n    \"h-2\": \"Attributes\",\n    \"0-0\": \"[Block](/docs/helpers#section-block), [Handlebars](/docs/helpers#section-handlebars)\",\n    \"0-1\": \"conditional value (any type)\",\n    \"0-2\": \"n/a\"\n  },\n  \"cols\": 3,\n  \"rows\": 1\n}\n[/block]\nThe `{{#if}}` block helper comes built in with Handlebars.\n\n### Description\n\n`{{#if}}` allows for testing very simple conditionals, and executing different template blocks depending on the outcome.\n\nThe conditionals that can be tested are very simple, essentially only checking for 'truthiness'. The evaluation rules are explained in the section below.\n\nLike all block helpers, `{{#if}}` supports adding an `{{else}}` block or using `^` instead of `#` for negation - this means that the `{{#if}}` and `{{else}}` blocks are reversed if you use `{{^if}}` and {{else}} instead.\n\n#### Evaluation rules\n\nThe if helper takes a single value, and evaluates whether it is true or false. Any passed in value which is equivalent to `false`, `0`, `undefined`, `null`, `\"\"` (an empty string) or `[]` (an empty array) is considered false, and any other value is considered true. \n\n - Any boolean value, like the featured flag on a post, will evaluate to true or false as you expect.\n - Any string value will be true, as long as it is not null or empty\n - All numerical values, with the exception of `0` evaluate to true, 0 is the same as false\n - Any property which doesn't exist or is not set will always evaluate false\n - Empty arrays or objects will be false\n\n### Example code\n\nWhen in the scope of a post, `featured` is a boolean flag. The following code example will evaluate to true only if the post is marked as featured.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"{{#post}}\\n  {{#if featured}}\\n   ...do something if the post is featured...\\n  {{/if}}\\n{{/post}}\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\nYou can also use this to test if any property is set. Strings, like image URLs will evaluate to true as long as one is present, and will be null (false) otherwise:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"{{#post}}\\n  {{#if image}}\\n     <img src=\\\"{{image}}\\\" />\\n  {{else}}\\n\\t\\t <img src=\\\"{{asset \\\"img/default-img.jpg\\\"}}\\\" />\\n  {{/if}}\\n{{/post}}\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\n**Note 1:** There's no need to switch between double and single quotes when writing HTML with handlebars. Double quotes can be used for both because the handlebars is executed first.\n\n**Note 2:** You don't need to use `{{#if}}` to test if a post exists in the previous example, because the `{{#post}}` block automatically does this for you and will support `{{else}}` or `^` syntax if needed:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"{{#post}}\\n  {{#if image}}\\n     <img src=\\\"{{image}}\\\" />\\n  {{else}}\\n     <img src=\\\"{{asset \\\"img/default-img.jpg\\\"}}\\\" />\\n  {{/if}}\\n{{else}}\\n<p>No posts to display!</p>\\n{{/post}}\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\n\nIf you want to negate the if statement, i.e. test that the conditional is false, rather than true, you can do so by using the `^` instead of `#` in the if helper, or you could use the [unless](doc:unless) helper if you prefer.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// This is identical to the `{{#unless}}` helper\\n{{^if featured}}\\n  ... the post is not featured...\\n{{/if}}\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\nIf you're looking to do more complex conditionals, E.g. testing for particular values of tags or authors, you need to check out the [has helper](doc:has) instead of the if helper.","excerpt":"`{{if}}` Helper - Test for a conditional","slug":"if","type":"basic","title":"if"}

if

`{{if}}` Helper - Test for a conditional

Usage: `{{#if featured}}{{/if}}` [block:parameters] { "data": { "h-0": "Type", "h-1": "Parameters", "h-2": "Attributes", "0-0": "[Block](/docs/helpers#section-block), [Handlebars](/docs/helpers#section-handlebars)", "0-1": "conditional value (any type)", "0-2": "n/a" }, "cols": 3, "rows": 1 } [/block] The `{{#if}}` block helper comes built in with Handlebars. ### Description `{{#if}}` allows for testing very simple conditionals, and executing different template blocks depending on the outcome. The conditionals that can be tested are very simple, essentially only checking for 'truthiness'. The evaluation rules are explained in the section below. Like all block helpers, `{{#if}}` supports adding an `{{else}}` block or using `^` instead of `#` for negation - this means that the `{{#if}}` and `{{else}}` blocks are reversed if you use `{{^if}}` and {{else}} instead. #### Evaluation rules The if helper takes a single value, and evaluates whether it is true or false. Any passed in value which is equivalent to `false`, `0`, `undefined`, `null`, `""` (an empty string) or `[]` (an empty array) is considered false, and any other value is considered true. - Any boolean value, like the featured flag on a post, will evaluate to true or false as you expect. - Any string value will be true, as long as it is not null or empty - All numerical values, with the exception of `0` evaluate to true, 0 is the same as false - Any property which doesn't exist or is not set will always evaluate false - Empty arrays or objects will be false ### Example code When in the scope of a post, `featured` is a boolean flag. The following code example will evaluate to true only if the post is marked as featured. [block:code] { "codes": [ { "code": "{{#post}}\n {{#if featured}}\n ...do something if the post is featured...\n {{/if}}\n{{/post}}", "language": "html" } ] } [/block] You can also use this to test if any property is set. Strings, like image URLs will evaluate to true as long as one is present, and will be null (false) otherwise: [block:code] { "codes": [ { "code": "{{#post}}\n {{#if image}}\n <img src=\"{{image}}\" />\n {{else}}\n\t\t <img src=\"{{asset \"img/default-img.jpg\"}}\" />\n {{/if}}\n{{/post}}", "language": "html" } ] } [/block] **Note 1:** There's no need to switch between double and single quotes when writing HTML with handlebars. Double quotes can be used for both because the handlebars is executed first. **Note 2:** You don't need to use `{{#if}}` to test if a post exists in the previous example, because the `{{#post}}` block automatically does this for you and will support `{{else}}` or `^` syntax if needed: [block:code] { "codes": [ { "code": "{{#post}}\n {{#if image}}\n <img src=\"{{image}}\" />\n {{else}}\n <img src=\"{{asset \"img/default-img.jpg\"}}\" />\n {{/if}}\n{{else}}\n<p>No posts to display!</p>\n{{/post}}", "language": "html" } ] } [/block] If you want to negate the if statement, i.e. test that the conditional is false, rather than true, you can do so by using the `^` instead of `#` in the if helper, or you could use the [unless](doc:unless) helper if you prefer. [block:code] { "codes": [ { "code": "// This is identical to the `{{#unless}}` helper\n{{^if featured}}\n ... the post is not featured...\n{{/if}}", "language": "html" } ] } [/block] If you're looking to do more complex conditionals, E.g. testing for particular values of tags or authors, you need to check out the [has helper](doc:has) instead of the if helper.