Creating multiple attribute in sightly from string | Community
Skip to main content
M
murilod74686477
December 20, 2016

Creating multiple attribute in sightly from string

  • December 20, 2016
  • 2 replies
  • 8077 views

Hello,

I am trying to create html attributes from a string with multiple attributes.

We have a string myAttrs = " class='myClass' id='myId' data-value='myCustomValue'".

I am trying to render that string as attributes of a html element.

Example input: <p ${myAttrs}> My paragraph </p>

Expected output: <p class='myClass' id='myId' data-value='myCustomValue'> My paragraph </p>

That does not work. Is there a sightly command to achieve my expected output without converting the string to a map and using data-sly-attribute?

Thank you

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

    2 replies

    Feike_Visser1
    Adobe Employee
    Feike_Visser1Adobe Employee
    Adobe Employee
    December 20, 2016

    Have a look at data-sly-attribute, you can pass in a map.

    https://docs.adobe.com/docs/en/htl/docs/block-statements.html

    Feike_Visser1
    Adobe Employee
    Feike_Visser1Adobe Employee
    Adobe Employee
    December 20, 2016

    Sorry missed you final sentence :-)

    Can you try @ context = 'unsafe'?

    sachind88574992
    sachind88574992
    May 31, 2018

    Has any one found a solution to this ?

    Feike_Visser1
    Adobe Employee
    Feike_Visser1Adobe Employee
    Adobe Employee
    May 31, 2018

    Use-api to convert String into Hashmap

    sachind88574992
    sachind88574992
    May 31, 2018

    Thanks Feike....I made it work like this.

    <sly data-sly-test.a=${item.parsysIds}></sly>

      <sly data-sly-test.b= "<dd ">

        ${a @context = 'unsafe'}${b @content='html'} class = "${item.parsysIds} ${wcmmode.edit ? '' : 'hide'}" id="${item.parsysIds}">

    It returns me:

    <dd notauthenticateduser class="notAuthenticatedUser hide" id="notAuthenticatedUser">


    Only problem with this approach is that the query selector gets updated to all lower case as you might see in the above example(notauthenticateduser).

    Do you know if this can be resolved?

    Terms & ConditionsAccessibility statement

    Loading footer...