Rendring code in html template sightly | Community
Skip to main content
August 17, 2016

Rendring code in html template sightly

  • August 17, 2016
  • 3 replies
  • 2201 views

Hi All,

Good evening!!!

Need small help on sighlty,

Created one component with below content and have to render layout based on selector as layout3, actually layout3 is objevalue.

<div data-sly-use.myObj="Test">
    <ul data-sly-list.keyName="${myObj.name}">

       <div data-sly-test.objvalue=${keyName} data-sly-unwrap/>

           <div  data-sly-resource="${objvalue @ resourceType='testing12/components/layout', selectors='layout3', wcmmode='disabled' }" data-sly-unwrap>
    </ul>
</div>

So layout3 component should be executed with below content but is the object is not rendering in layout3.

<li>KEY: ${keyName}, VALUE: ${myObj.name[keyName]}</li>

It is working fine if put code in one component  with out selector.

Thanks in advance.

Nani.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

3 replies

smacdonald2008
August 17, 2016

check the HTL spec - it talks about use of selectors:

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

kautuk_sahni
Community Manager
Community Manager
August 19, 2016

Please have a look at this post, 

Link:- http://stackoverflow.com/questions/28571842/display-different-markup-in-sightly-based-on-a-sling-selector

//Display different markup in HTML Template Language (HTL formerly known as Sightly) based on a Sling selector

 

Also Refer to the documentation here :-

Link:- https://docs.adobe.com/docs/en/htl/docs/block-statements.html (Search for Selector)

//

    Add (or replace) a selector:

     <article data-sly-resource="${'path/to/resource' @ selectors='selector'}"></article>
    Code samples are intended for illustration purposes only.

    Add, replace or remove multiple selectors:

     <article data-sly-resource="${'path/to/resource' @ selectors=['s1', 's2']}"></article>
    Code samples are intended for illustration purposes only.

    Add a selector to the existing ones:

     <article data-sly-resource="${'path/to/resource' @ addSelectors='selector'}"></article>
    Code samples are intended for illustration purposes only.

    Remove some selectors from the existing ones:

     <article data-sly-resource="${'path/to/resource' @ removeSelectors='selector1'}"></article>
    Code samples are intended for illustration purposes only.

    Remove all selectors:

     <article data-sly-resource="${'path/to/resource' @ removeSelectors}"></article>

I hope this would help you.

 

Thanks and Regards

Kautuk Sahni

Kautuk Sahni
antoniom5495929
August 19, 2016

Before calling the other component with selectors try to define a template:

<template data-sly-template.objectValue="${@ key, value}">