Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

Displaying JSON Object or JSON with HTL and Javascript Use

Avatar

Level 2

How can I display JS object properties or iterate over JSON objects using sly-data-list.

Here's my particular JSON

{"make":"Honda","model":"civic"}

Would something like this require a mixed model with local Java class?

Thanks

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

try below

HTL

<div data-sly-use.head="logic.js">

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

  <li>${item.make}</li>

</ul>

</div>

logic.js

use(function () {

    return {

        list2:JSON.parse('[{"make":"Honda","model":"civic"} ,{"make":"Honda2","model":"civic2"}]')

    }

});



Arun Patidar

View solution in original post

3 Replies

Avatar

Correct answer by
Community Advisor

try below

HTL

<div data-sly-use.head="logic.js">

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

  <li>${item.make}</li>

</ul>

</div>

logic.js

use(function () {

    return {

        list2:JSON.parse('[{"make":"Honda","model":"civic"} ,{"make":"Honda2","model":"civic2"}]')

    }

});



Arun Patidar

Avatar

Level 2

Thank you, I was reading it as a JSON in crxde property and overlooked that it's actually a string.

Was missing the JSON.parse function