Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

Issues in using pageproperties in Underscore JS

v1101
Level 5
Level 5

Hello All - I am using Underscore JS for component creation. The below snippet is not working for the page properties. Can someone tell how to address this?

 

<script type="text/template" id="testView">
<% _.each(test, function(test) { %>
<div class="templatetest">
<sly data-sly-test=" <% ${properties.displayimages} %> ">     (This line of code doesn't work)
<img src="<%= test.image %>" class="w-full" alt="">
</sly>
</div>
<% });%>
</script>

1 Accepted Solution
Suraj_Kamdi
Correct answer by
Community Advisor
Community Advisor

@v1101 

Use context="unsafe"

 

<sly data-sly-test=" <% ${properties.displayimages @context="unsafe"} %> "> 

 

I hope this will help.

View solution in original post

0 Replies
ArpitVarshney
Community Advisor
Community Advisor

Hi @v1101 

It seems you are mixing JSP and HTL syntaxes. If your script file contains extension as .html then follow HTL documentation else follow JSP.

 

It looks like your script file is JSP as most of your shared code follows JSP syntaxes and JSP doesn't support sly and data-sly-test. It is HTL syntax of testing an expression. Please go through the link to get the corresponding syntax https://stackoverflow.com/questions/28409916/how-to-check-null-from-jcr-value-in-adobe-cq5

 

Regards.

Arpit Varshney

Suraj_Kamdi
Correct answer by
Community Advisor
Community Advisor

@v1101 

Use context="unsafe"

 

<sly data-sly-test=" <% ${properties.displayimages @context="unsafe"} %> "> 

 

I hope this will help.

View solution in original post

Suraj_Kamdi
Community Advisor
Community Advisor

@v1101 

updating above

<div class="templatetest">

   <sly data-sly-test="${properties.displayimages @context='unsafe'}"> 

       <img src="<%= test.image %>" class="w-full" alt="">

   </sly> 

</div>