2

I'm creating a new project, and I'd like to namespace a few of my helpers for sightly. These helpers are "template.html files". I'm currently calling them with the normal pattern of:

<sly data-sly-use.MyHelper='MyHelper.html' data-sly-call="${MyHelper.tmpl @ args..}"/>

What I'm appreciating about Sightly is the fact that I can do something like this:

templates.html

<template data-sly-template.one>1</template>
<template data-sly-template.two>2</template>

main.html

<sly data-sly-use.tmpls="templates.html"/>

one: <sly data-sly-call=${tmpls.one}/>
two <sly data-sly-call=${tmpls.two}/>

What I would like to set up is:

library.html (includes more modular template functionality)

<sly data-sly-import="one.html"/>
<sly data-sly-import="two.html"/>

main.html (imports library)

<sly data-sly-use.libs="library.html"/>

one: <sly data-sly-call=${libs.one}/>
two <sly data-sly-call=${libs.two}/>

I have tried a couple variations of the latter to see if there was already something OTTB that's supported. Perhaps I was just hooking it up incorrectly, but does anyone know if this is possible?

thank you,

Brodie

Brodie
  • 8,399
  • 8
  • 35
  • 55

1 Answers1

1

From the HTL Spec:

When templates are located in a separate file, they can be loaded with data-sly-use

You are already doing this in your working example with data-sly-use and data-sly-call in your main.html to the data-sly-template in your template.html. You just need to do it one more time in your library.html.

main.html (imports library)

<sly data-sly-use.libs="library.html"/>

one: <sly data-sly-call=${libs.one}/>
two <sly data-sly-call=${libs.two}/>

library.html (includes more modular template functionality)

<template data-sly-template.one>
    <div data-sly-use.one="one.html" data-sly-call="${one.one}"></div>
</template>

<template data-sly-template.two">
    <div data-sly-use.two="two.html" data-sly-call="${two.two}"></div>
</template>

one.html

<template data-sly-template.one>this is one</template>

two.html

<template data-sly-template.two>this is two</template>

This will allow you to import all your helpers via one data-sly-use expression while keeping your helper templates in separate files just as you asked for, even if the intermediary library.html isn't as succinct as you probably wanted.

nateyolles
  • 1,851
  • 5
  • 17
  • 23
  • I was really hoping for a solution that didn't involve redefining the templates in library.html. But I think this is the only way to do it right now. I think that it would be worth it at this point to do stuff like define templates in a single file and maybe include partials as needed into those templates. Then name the files accordingly, like CommonUtils.html, JsonUtils.html, etc, etc, etc. Thank you! – Brodie Aug 16 '16 at 14:23