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

Accessing nested properties via sightly

Avatar

Level 4

Happy Thanksgiving! I shouldn't be working but this issue is driving me nuts and I'd love to figure this out.

I have a use java class that has a method called getPage. The code is below. The idea is to get all the child page underneath the page where this component lives. 

public List<Page> getPage() { List<Page> results = new ArrayList<Page>(); Iterator<Page> children = getCurrentPage().listChildren(); while (children.hasNext()) { Page child = children.next(); results.add(child); } return results; }

I call it in my component like so

<div class="directory"> <div class="row" data-sly-list.childPage="${comp.page}"> <div class="small-6 medium-3 large-3 columns"> <a href="${childPage.path}"> <img src="#nestedProperty"> <h4>${childPage.title}</h4> </a> </div> </div> </div>

tile and path work great, but I'd like to call a nested property. Here's the nested property (slide1FileReference) I'm talking about.

I found some documenation online and tried this but it doesn't work

<img src="${childPage.properties[root/c1_leadspace_carouse/slide1FileReference]}">
1 Accepted Solution

Avatar

Correct answer by
Level 4

Missing quotes -__-

 

<img src="${childPage.properties['root/c1_leadspace_carouse/slide1FileReference']}">

View solution in original post

4 Replies

Avatar

Correct answer by
Level 4

Missing quotes -__-

 

<img src="${childPage.properties['root/c1_leadspace_carouse/slide1FileReference']}">

Avatar

Employee

The way you access the properties is correct.

Can you share a package or so?

Avatar

Level 4

I was missing the single quotes! All good now thanks for commenting on the holiday!

Avatar

Employee

Indeed the quotes :-)

BTW: No Java is needed here.

<div class="directory">
        <div class="row" data-sly-list.childPage="${currentPage.listChildren}">
            <div class="small-6 medium-3 large-3 columns">
                <a href="${childPage.path}">
                    <h4>${childPage.title}</h4>
                    <h4>${childPage.properties['cq:template']}</h4>
                </a>
            </div>
        </div>
    </div>