Source: lib/tags/autoescape.js
Control auto-escaping of variable output from within your templates.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
control | boolean or string |
undefined |
One of `true`, `false`, `"js"` or `"html"`. |
// myvar = '<foo>';
{% autoescape true %}{{ myvar }}{% endautoescape %}
// => <foo>
{% autoescape false %}{{ myvar }}{% endautoescape %}
// => <foo>
Source: lib/tags/block.js
Defines a block in a template that can be overridden by a template extending this one and/or will override the current template's parent template block of the same name.
See Template Inheritance for more information.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
name | literal |
undefined |
Name of the block for use in parent and extended templates. |
{% block body %}...{% endblock %}
Source: lib/tags/else.js
Used within an {% if %}
tag, the code block following this tag up until {% endif %}
will be rendered if the if statement returns false.
{% if false %}
statement1
{% else %}
statement2
{% endif %}
// => statement2
Source: lib/tags/elseif.js
Like {% else %}
, except this tag can take more conditional statements.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
conditional | mixed |
undefined |
Conditional statement that returns a truthy or falsy value. |
{% if false %}
Tacos
{% elseif true %}
Burritos
{% else %}
Churros
{% endif %}
// => Burritos
Source: lib/tags/extends.js
Makes the current template extend a parent template. This tag must be the first item in your template.
See Template Inheritance for more information.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
parentFile | string |
undefined |
Relative path to the file that this template extends. |
{% extends "./layout.html" %}
Source: lib/tags/filter.js
Apply a filter to an entire block of template.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
filter | function |
undefined |
The filter that should be applied to the contents of the tag. |
{% filter uppercase %}oh hi, {{ name }}{% endfilter %}
// => OH HI, PAUL
{% filter replace(".", "!", "g") %}Hi. My name is Paul.{% endfilter %}
// => Hi! My name is Paul!
Source: lib/tags/for.js
Loop over objects and arrays.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
key | literal |
✔ | undefined |
A shortcut to the index of the array or current key accessor. |
variable | literal |
undefined |
The current value will be assigned to this variable name temporarily. The variable will be reset upon ending the for tag. | |
in | literal |
undefined |
Literally, "in". This token is required. | |
object | object |
undefined |
An enumerable object that will be iterated over. |
loop.index: The current iteration of the loop (1-indexed)
loop.index0: The current iteration of the loop (0-indexed)
loop.revindex: The number of iterations from the end of the loop (1-indexed)
loop.revindex0: The number of iterations from the end of the loop (0-indexed)
loop.key: If the iterator is an object, this will be the key of the current item, otherwise it will be the same as the loop.index.
loop.first: True if the current object is the first in the object or array.
loop.last: True if the current object is the last in the object or array.
// obj = { one: 'hi', two: 'bye' };
{% for x in obj %}
{% if loop.first %}<ul>{% endif %}
<li>{{ loop.index }} - {{ loop.key }}: {{ x }}</li>
{% if loop.last %}</ul>{% endif %}
{% endfor %}
// => <ul>
// <li>1 - one: hi</li>
// <li>2 - two: bye</li>
// </ul>
// arr = [1, 2, 3]
// Reverse the array, shortcut the key/index to `key`
{% for key, val in arr|reverse %}
{{ key }} -- {{ val }}
{% endfor %}
// => 0 -- 3
// 1 -- 2
// 2 -- 1
Source: lib/tags/if.js
Used to create conditional statements in templates. Accepts most JavaScript valid comparisons.
Can be used in conjunction with {% elseif ... %}
and {% else %}
tags.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
conditional | mixed |
undefined |
Conditional statement that returns a truthy or falsy value. |
{% if x %}{% endif %}
{% if !x %}{% endif %}
{% if not x %}{% endif %}
{% if x and y %}{% endif %}
{% if x && y %}{% endif %}
{% if x or y %}{% endif %}
{% if x || y %}{% endif %}
{% if x || (y && z) %}{% endif %}
{% if x [operator] y %}
Operators: ==, !=, <, <=, >, >=, ===, !==
{% endif %}
{% if x == 'five' %}
The operands can be also be string or number literals
{% endif %}
{% if x|lower === 'tacos' %}
You can use filters on any operand in the statement.
{% endif %}
{% if x in y %}
If x is a value that is present in y, this will return true.
{% endif %}
Source: lib/tags/import.js
Allows you to import macros from another file directly into your current context.
The import tag is specifically designed for importing macros into your template with a specific context scope. This is very useful for keeping your macros from overriding template context that is being injected by your server-side page generation.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
file | string or var |
undefined |
Relative path from the current template file to the file to import macros from. | |
as | literal |
undefined |
Literally, "as". | |
varname | literal |
undefined |
Local-accessible object name to assign the macros to. |
{% import './formmacros.html' as forms %}
{{ form.input("text", "name") }}
// => <input type="text" name="name">
{% import "../shared/tags.html" as tags %}
{{ tags.stylesheet('global') }}
// => <link rel="stylesheet" href="/global.css">
Source: lib/tags/include.js
Includes a template partial in place. The template is rendered within the current locals variable context.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
file | string or var |
undefined |
The path, relative to the template root, to render into the current context. | |
with | literal |
✔ | undefined |
Literally, "with". |
context | object |
✔ | undefined |
Local variable key-value object context to provide to the included file. |
only | literal |
✔ | undefined |
Restricts to only passing the with context as local variables�the included template will not be aware of any other local variables in the parent template. For best performance, usage of this option is recommended if possible. |
ignore missing | literal |
✔ | undefined |
Will output empty string if not found instead of throwing an error. |
// food = 'burritos';
// drink = 'lemonade';
{% include "./partial.html" %}
// => I like burritos and lemonade.
// my_obj = { food: 'tacos', drink: 'horchata' };
{% include "./partial.html" with my_obj only %}
// => I like tacos and horchata.
{% include "/this/file/does/not/exist" ignore missing %}
// => (Nothing! empty string)
Source: lib/tags/macro.js
Create custom, reusable snippets within your templates.
Can be imported from one template to another using the {% import ... %}
tag.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
arguments | arguments |
undefined |
User-defined arguments. |
{% macro input(type, name, id, label, value, error) %}
<label for="{{ name }}">{{ label }}</label>
<input type="{{ type }}" name="{{ name }}" id="{{ id }}" value="{{ value }}"{% if error %} class="error"{% endif %}>
{% endmacro %}
{{ input("text", "fname", "fname", "First Name", fname.value, fname.errors) }}
// => <label for="fname">First Name</label>
// <input type="text" name="fname" id="fname" value="">
Source: lib/tags/parent.js
Inject the content from the parent template's block of the same name into the current block.
See Template Inheritance for more information.
{% extends "./foo.html" %}
{% block content %}
My content.
{% parent %}
{% endblock %}
Source: lib/tags/raw.js
Forces the content to not be auto-escaped. All swig instructions will be ignored and the content will be rendered exactly as it was given.
// foobar = '<p>'
{% raw %}{{ foobar }}{% endraw %}
// => {{ foobar }}
Source: lib/tags/set.js
Set a variable for re-use in the current context. This will over-write any value already set to the context for the given varname.
Name | Type | Optional | Default | Description |
---|---|---|---|---|
varname | literal |
undefined |
The variable name to assign the value to. | |
assignement | literal |
undefined |
Any valid JavaScript assignement. =, +=, *=, /=, -= |
|
value | * |
undefined |
Valid variable output. |
{% set foo = "anything!" %}
{{ foo }}
// => anything!
// index = 2;
{% set bar = 1 %}
{% set bar += index|default(3) %}
// => 3
// foods = {};
// food = 'chili';
{% set foods[food] = "con queso" %}
{{ foods.chili }}
// => con queso
// foods = { chili: 'chili con queso' }
{% set foods.chili = "guatamalan insanity pepper" %}
{{ foods.chili }}
// => guatamalan insanity pepper
Source: lib/tags/spaceless.js
Attempts to remove whitespace between HTML tags. Use at your own risk.
{% spaceless %}
{% for num in foo %}
<li>{{ loop.index }}</li>
{% endfor %}
{% endspaceless %}
// => <li>1</li><li>2</li><li>3</li>