iterating over array of objects using data-sly-list using JS use api causing issues | Community
Skip to main content
August 3, 2018

iterating over array of objects using data-sly-list using JS use api causing issues

  • August 3, 2018
  • 1 reply
  • 2471 views

Hi,

I have a multifield component in rtouch UI and its values are getting saved in JCR:content as a node property in the form of string[]. Now I am retrieving the array inside javascript use(function(){}) and iterating over the object using data-sly-list. Below is my code:

var linkObj =[{"title":"SAS App","path":"/content/sassi-blueprint/en/products/sas-app"},

             {"title":"Charter Information","path":"/content/sassi-blueprint/en/products/charter-information"},

             {"title":"Welcome to Global Internet Support","path":"/content/sassi-blueprint/en/digital-channels/welcome-to-global-internet-support"},

             {"title":"Manual reservation","path":"/content/sassi-blueprint/en/digital-channels/manual-reservation"}

            ];

    return{

        linkObj: linkObj

    }

<ul  data-sly-list="${info.linkObj}" >

     <li class="col-lg-4 col-md-4 col-sm-4 col-xs-12">

          <span>${item}</span>

     </li>

</ul>

The output for this is

title, path

title, path

title, path

title, path

Instead of the values it prints the properties. Is there something wrong with the linkObj? Can it be done through JS or do we need to achieve this through java?

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

1 reply

arunpatidar
Community Advisor
Community Advisor
August 3, 2018

Yes, your code is not correct. you need to do like ${item.property}

e.g.

<ul data-sly-list="${info.linkObj}" >

     <li class="col-lg-4 col-md-4 col-sm-4 col-xs-12">

          <span>${item.path}</span> -----  <span>${item.title}</span>

     </li>

</ul>

Thanks

Arun

Arun Patidar
August 8, 2018

Yes i did that. There was some issue with the object itself but it's resolved now. Thanks.