Swig

A Node.js and Browser-based JavaScript Template Engine

Tags

autoescape

Source: lib/tags/autoescape.js

Control auto-escaping of variable output from within your templates.

Parameters

Name Type Optional Default Description
control boolean or string undefined One of `true`, `false`, `"js"` or `"html"`.

Examples

// myvar = '<foo>';
{% autoescape true %}{{ myvar }}{% endautoescape %}
// => <foo>
{% autoescape false %}{{ myvar }}{% endautoescape %}
// => <foo>

block

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.

Parameters

Name Type Optional Default Description
name literal undefined Name of the block for use in parent and extended templates.

Examples

{% block body %}...{% endblock %}

else

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.

Examples

{% if false %}
  statement1
{% else %}
  statement2
{% endif %}
// => statement2

elif

Source: lib/tags/elseif.js

Like {% else %}, except this tag can take more conditional statements.

Parameters

Name Type Optional Default Description
conditional mixed undefined Conditional statement that returns a truthy or falsy value.

Examples

{% if false %}
  Tacos
{% elseif true %}
  Burritos
{% else %}
  Churros
{% endif %}
// => Burritos

extends

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.

Parameters

Name Type Optional Default Description
parentFile string undefined Relative path to the file that this template extends.

Examples

{% extends "./layout.html" %}

filter

Source: lib/tags/filter.js

Apply a filter to an entire block of template.

Parameters

Name Type Optional Default Description
filter function undefined The filter that should be applied to the contents of the tag.

Examples

{% filter uppercase %}oh hi, {{ name }}{% endfilter %}
// => OH HI, PAUL
{% filter replace(".", "!", "g") %}Hi. My name is Paul.{% endfilter %}
// => Hi! My name is Paul!

for

Source: lib/tags/for.js

Loop over objects and arrays.

Parameters

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.

Returns

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.

Examples

// 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

if

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.

Parameters

Name Type Optional Default Description
conditional mixed undefined Conditional statement that returns a truthy or falsy value.

Examples

{% 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 %}

import

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.

Parameters

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.

Examples

{% import './formmacros.html' as form %}
{{ form.input("text", "name") }}
// => <input type="text" name="name">
{% import "../shared/tags.html" as tags %}
{{ tags.stylesheet('global') }}
// => <link rel="stylesheet" href="/global.css">

include

Source: lib/tags/include.js

Includes a template partial in place. The template is rendered within the current locals variable context.

Parameters

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.

Examples

// 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)

macro

Source: lib/tags/macro.js

Create custom, reusable snippets within your templates.

Can be imported from one template to another using the {% import ... %} tag.

Parameters

Name Type Optional Default Description
arguments arguments undefined User-defined arguments.

Examples

{% 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="">

parent

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.

Examples

{% extends "./foo.html" %}
{% block content %}
  My content.
  {% parent %}
{% endblock %}

raw

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.

Examples

// foobar = '<p>'
{% raw %}{{ foobar }}{% endraw %}
// => {{ foobar }}

set

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.

Parameters

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.

Examples

{% 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

spaceless

Source: lib/tags/spaceless.js

Attempts to remove whitespace between HTML tags. Use at your own risk.

Examples

{% spaceless %}
  {% for num in foo %}
  <li>{{ loop.index }}</li>
  {% endfor %}
{% endspaceless %}
// => <li>1</li><li>2</li><li>3</li>