data-sly-repeat in data attribute | Community
Skip to main content
A
angelinek209805
Level 2
December 18, 2018
Solved

data-sly-repeat in data attribute

  • December 18, 2018
  • 4 replies
  • 2504 views

For 6.4.2 with HTL code:

<div data-sly-repeat.tag="${item.tags}">

  <a>${tag.name}</a>

</div>

This will output

<div>

<a>tag-1</a><a>tag-2</a>

</div>

I am trying to achieve the following

1) How can I add a comma between the list?

<a>tag-1</a>,<a>tag-2</a>

2) How to have the repeat in a data attribute?

I am trying to output the following

<div data-filter="tag-1,tag-2">...</div>

With HTL

<div data-sly-repeat.tag="${item.tags}" data-sly-attribute.data-tag-filter="${tag.name}">...</div>

But it output

<div data-filter="tag-1">...</div>

<div data-filter="tag-2">...</div>


Thanks in advance.

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

    1) You can do it like below:

    <sly data-sly-list="${head.list}">

      <a>${item}</a><sly data-sly-test="${!itemList.last}">,</sly>

    </sly>

    2) For attribute directly pass your list

    <div data-sly-attribute.data-filter="${head.list}">Attribute</div>

    4 replies

    arunpatidar
    Community Advisor
    arunpatidarCommunity AdvisorAccepted solution
    Community Advisor
    December 18, 2018

    1) You can do it like below:

    <sly data-sly-list="${head.list}">

      <a>${item}</a><sly data-sly-test="${!itemList.last}">,</sly>

    </sly>

    2) For attribute directly pass your list

    <div data-sly-attribute.data-filter="${head.list}">Attribute</div>

    Arun Patidar
      A
      angelinek209805Author
      Level 2
      December 18, 2018

      Thanks Arun. Do I understand correctly that there is no way using existing HTL logic to achieve data-sly-list/data-sly-repeat in a data attribute element? Only way to achieve this is via JS Use API or Java Sling modal?

      arunpatidar
      Community Advisor
      arunpatidarCommunity Advisor
      Community Advisor
      December 18, 2018

      Hi,

      I used JS Use Api for demo purpose. But you can use any list either from JS, Model or WCMUseAPI or from HTL(e.g. resource.listChildren).

      But In your case if you want specific property of list item inside attribute then yes you need to return separate list only with desire value in, list and use inside tag e.g. <div data-sly-attribute.data-filter="${tag.nameList}">Attribute</div>

      Arun Patidar
      A
      angelinek209805Author
      Level 2
      December 19, 2018

      Thanks Arun. Is it the same case for data-sly-repeat/data-sly-list in a class attribute?

      Terms & ConditionsAccessibility statement

      Loading footer...