data-sly-repeat in data attribute

angelinek209805

17-12-2018

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.

Accepted Solutions (1)

Accepted Solutions (1)

Arun_Patidar

MVP

18-12-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>

Screenshot 2018-12-18 at 6.28.04 PM.png

Answers (3)

Answers (3)

Arun_Patidar

MVP

18-12-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>

angelinek209805

18-12-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?