Here's a concise cheatsheet for Mustache templating:
- Variables:
{{variable}}
- Escaped HTML:
{{variable}}
(default) - Unescaped HTML:
{{{variable}}}
or{{& variable}}
- Comments:
{{! comment }}
- Standard section:
{{#section}}...{{/section}}
- Inverted section:
{{^section}}...{{/section}}
- Include partial:
{{> partial_name}}
{{#condition}}
Shown if condition is truthy
{{/condition}}
{{^condition}}
Shown if condition is falsy
{{/condition}}
{{#array}}
{{.}} <!-- Current item -->
{{name}} <!-- Property of current item -->
{{/array}}
{{#uppercase}}
text to be uppercased
{{/uppercase}}
{{=<% %>=}}
changes delimiters to <% %>
Access nested properties: {{person.name}}
{{.}}
: Current context{{this}}
: Current object in a list
{{../parentProperty}}
{{~variable}}
: Remove whitespace before{{variable~}}
: Remove whitespace after
- Keep logic in the view model, not in templates
- Use partials for reusable components
- Leverage sections for conditional rendering and loops
- Use inverted sections for fallback content
- Escape HTML by default, use triple mustaches only when necessary
Remember, Mustache is "logic-less," so complex operations should be handled in your data preparation before rendering the template.