What is the difference between data-sly-use, data-sly-resource, data-sly-include, and data-sly-template?

Question

What is the difference between: data-sly-use, data-sly-resource, data-sly-include, and data-sly-template? I am reading the doc on Sightly AEM and I am super confused.

As far as I can see:

• data-sly-use is used to add js/java files to render with the doc
• data-sly-resource is used to inject components
• data-sly-include is used to include other html files (?***?)

And, data-sly-template is confusing, as in:

<div data-sly-use.nav="navigation.js">${nav.foo}</div>
<section data-sly-include="path/to/template.html"></section>
<template data-sly-template.one>blah</template>
<div data-sly-call="${one}"></div>

Solution 1

As you already said:

• data-sly-use "is used to add js/java". You declare component-beans with this statement for instance.
• data-sly-resource you can override a resource-type for a included file.
• data-sly-include includes other html files as the name suggests.
• data-sly-template you declare templates which can later be 'called' with data-sly-call.

Please refere to the official specs for more informations. there are several examples for each tag:

https://github.com/Adobe-Marketing-Cloud/sightly-spec/blob/master/SPECIFICATION.md

Solution 2

• data-sly-use - is same what @chrysler quoted.
• data-sly-include vs data-sly-resource - data-sly-resource creates a new internal request against the sling engine, where as data-sly-include looks for the specified script/servlet and executes it, using the same request context, i.e. the same current resource.

From Docs - https://helpx.adobe.com/experience-manager/htl/using/block-statements.html - data-sly-include: Replaces the content of the host element with the markup generated by the indicated HTML template file (HTL, JSP, ESP etc.) when it is processed by its corresponding template engine. The rendering context of the included file will not include the current HTL context (that of the including file);

The answer is relevant for v6.3.

Comments

[Oliver]

I still feel this is a very brief explanation. Need more clarification with examples for this.

[ccpizza]

data-sly-use can be used with a resource path too, e.g. you can do <sly data-sly-use.parsys=${resource.path}/parsys> for example in order to loop over children with data-sly-list=${parsys.listChildren}