Extensions AEM aem-extensions

Tout comme les extensions Apache Sling de la spécification HTL, AEM propose des options d’expression supplémentaires qui facilitent l’utilisation des concepts AEM directement dans les scripts HTL.

i18n i18n

Il est possible d’utiliser les trois mêmes options supplémentaires que dans Apache Sling avec i18n :

Toutefois, dans AEM, la prise en charge de l’internationalisation de HTL est implémentée à l’aide de l’API du package com.day.cq.i18n.

data-sly-include data-sly-include

Dans AEM, data-sly-include peut prendre en charge une option wcmmode supplémentaire qui contrôle le mode de gestion de contenu web pour le script inclus. Les valeurs autorisées sont les noms des constantes d’énumération disponibles.

data-sly-resource data-sly-resource

En plus des chemins d’accès et des Resources, l’élément de bloc data-sly-resource peut également fonctionner avec des Maps ou des Records. Ces deux approches nécessitent de fournir la propriété de chaîne resourceName. Sa valeur est utilisée pour créer une ressource synthétique qui est incluse dans le contexte du rendu. Le reste des propriétés de l’Record ou de la Map qui ont été transmises à data-sly-resource sont utilisées comme des propriétés Resource normales. Si la propriété sling:resourceType est absente de ce mappage, on suppose que le type de ressource correspond soit à la valeur de l’option d’expression resourceType, soit au type de ressource de la ressource active qui oriente le rendu.

Compte tenu des propriétés de mappage/enregistrement suivantes disponibles dans la portée du script comme map :

{
    resourceName: "myText",
    "sling:resourceType": "core/wcm/components/text/v2/text",
    "text": "Hello World!"
}

Et compte tenu de la balise suivante :

<div class="outer" data-sly-resource="${map}"></div>

La sortie suivante est attendue :

<div class="outer">
    <div class="myText">
        <div data-cmp-data-layer="{&quot;text-e58d65c472&quot;:{&quot;@type&quot;:&quot;core/wcm/components/text/v2/text&quot;,&quot;xdm:text&quot;:&quot;<p>Hello world!</p>&quot;}}" id="text-e58d65c472" class="cmp-text">
            <p>Hello world!</p>
        </div>
  </div>
</div>