Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

Method Availability in global objects in JS USE API

Avatar

Level 5

In a JS USE API class I'm trying to access hasChildren of the org.apache.sling.api.resource.Resource but I keep getting the error: TypeError: Cannot find function hasChildren in object.

code:

result = this.page.getContentResource('MainContent').hasChildren()

I've tested other stuff and at least getName and getPath are accessible in this way. Are all of the methods of a given class available to the JS USE API?

1 Accepted Solution

Avatar

Correct answer by
Level 5

Thanks for the help all, 

This is what I ended up implementing, I'm not sure if this could be done any more elegantly, but it seems to work well.

sightly:

<div data-sly-use.hasChildren="${'hasChildren.js' @ parsys='MainContent', page=currentPage}" data-sly-unwrap> <div data-sly-test="${wcmmode.edit || hasChildren}" data-sly-unwrap> <div data-sly-resource="${'MainContent' @ resourceType='foundation/components/parsys'}"></div> </div> </div>

hasChildren.js

"use strict"; use(["/libs/wcm/foundation/components/utils/ResourceUtils.js", "/libs/sightly/js/3rd-party/q.js"], function (ResourceUtils, Q) { var result = false; var childPromise = Q.defer(); if(this.page.getContentResource(this.parsys) != null) { ResourceUtils.getResource(this.page.getContentResource(this.parsys).getPath()).then(function(res) { res.getChildren().then(function (childItems) { childPromise.resolve(childItems.length > 0); }, function (error) { childPromise.resolve(false); }); }, function (error) { childPromise.resolve(false); }); return childPromise.promise; } });

View solution in original post

5 Replies

Avatar

Level 7

Can you try listChildren() instead of hasChildren() because org.apache.sling.api.resource.Resource don't have such a method. Refer: https://sling.apache.org/apidocs/sling6/org/apache/sling/api/resource/Resource.html . On top of result u can check result.next() which returns true if there are any sub-nodes for the given resource.

Avatar

Level 5

I see, I was refering to https://docs.adobe.com/docs/en/aem/6-1/ref/javadoc/index.html -- odd that that wouldn't be the version implemented on in the use api.

When I attempt se suggested solution solution, I get an error:

TypeError: Cannot find default value for object. (/apps/newsadmin/components/page/newsTemplate/bodyinner.html#6)

Lines 5 & 6 in my js class

var myresult = this.page.getContentResource(this.parsys).listChildren(); result = myresult.hasNext();

Avatar

Employee

Hi,

From JavaScript, Resource objects have a slightly different interface than in Java. You can see the 6.1 method list here: http://svn.apache.org/viewvc/sling/trunk/bundles/scripting/javascript/src/main/java/org/apache/sling...

Regards,

Justin

Avatar

Correct answer by
Level 5

Thanks for the help all, 

This is what I ended up implementing, I'm not sure if this could be done any more elegantly, but it seems to work well.

sightly:

<div data-sly-use.hasChildren="${'hasChildren.js' @ parsys='MainContent', page=currentPage}" data-sly-unwrap> <div data-sly-test="${wcmmode.edit || hasChildren}" data-sly-unwrap> <div data-sly-resource="${'MainContent' @ resourceType='foundation/components/parsys'}"></div> </div> </div>

hasChildren.js

"use strict"; use(["/libs/wcm/foundation/components/utils/ResourceUtils.js", "/libs/sightly/js/3rd-party/q.js"], function (ResourceUtils, Q) { var result = false; var childPromise = Q.defer(); if(this.page.getContentResource(this.parsys) != null) { ResourceUtils.getResource(this.page.getContentResource(this.parsys).getPath()).then(function(res) { res.getChildren().then(function (childItems) { childPromise.resolve(childItems.length > 0); }, function (error) { childPromise.resolve(false); }); }, function (error) { childPromise.resolve(false); }); return childPromise.promise; } });

Avatar

Level 10

There are a lot of out of the box components under /libs/wcm/foundation/components that make use of the Use API.