| Description | Allows rendering of Mustache.js. |
| Required Script |
<script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.1.js"></script>
|
| Examples | None |
[TOC]
Mustache is a logic-less template syntax. See Mustache.js docs for more details. Some of the core Mustache tags are:
{{variable}}: A variable tag. It outputs the the HTML-escaped value of a variable.{{#section}}``{{/section}}: A section tag. It can test the existence of a variable and iterate over it if it's an array.{{^section}}``{{/section}}: An inverted tag. It can test the non-existence of a variable.
The amp-mustache template has to be defined and used according to the
AMP Template Spec.
First, the amp-mustache has to be declared/loaded like this:
<script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.1.js"></script>Then, the Mustache templates can be defined in the template tags like this:
<template type="amp-mustache">
Hello {{world}}!
</template>How templates are discovered, when they are rendered, how data is provided - all decided by the target AMP element that uses this template to render its content.
Like all AMP templates, amp-mustache templates are required to be well-formed DOM fragments. This means
that among other things, you can't use amp-mustache to:
- Calculate tag name. E.g.
<{{tagName}}>is not allowed. - Calculate attribute name. E.g.
<div {{attrName}}=something>is not allowed. - Output arbitrary HTML using
{{{unescaped}}}. The output of "triple-mustache" is sanitized to only allow formatting tags such as<b>,<i>, and so on.
Notice also that because the body of the template has to be specified within the template element, it is
impossible to specify {{&var}} expressions - they will always be escaped as {{&var}}. The triple-mustache
{{{var}}} has to be used for these cases.
See amp-mustache rules in the AMP validator specification.