Skip to content

Instantly share code, notes, and snippets.

@saulovenancio
Forked from kevinweber/component.html
Created December 30, 2019 12:54
Show Gist options
  • Save saulovenancio/e6738d6356c824fa5897a34473987e58 to your computer and use it in GitHub Desktop.
Save saulovenancio/e6738d6356c824fa5897a34473987e58 to your computer and use it in GitHub Desktop.
HTL/Sightly: "Use and call template" pattern. Put template into separate file for reusability, and pass parameters when calling it. Note that in most cases it's not necessary to pass "properties" to the template because they work even if they're not passed explicitly.
<sly data-sly-use.component="template.html"
data-sly-call="${component.template @ properties=properties}" />
<template data-sly-template.templateText="${@ properties}">
<div data-sly-resource="${'text' @ resourceType='core/wcm/components/text/v1/text'}"></div>
</template>
<sly data-sly-call="${templateText @ properties=properties}" />
<template data-sly-template.template="${@ properties}">
<p>${properties.onePropertyValue @ i18n}</p>
</template>
<sly data-sly-use.templates="core/wcm/components/commons/v1/templates.html"
data-sly-call="${templates.placeholder @ isEmpty = true}"></sly>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment