Search code examples
javascriptaemsightly

AEM Sightly to get properties of child nodes.

So it looks like sightly is great for getting properties, but I would like to work get properties of other child nodes that I have defined.

Here is the start of my PictureFill Component structure:

{
  jcr:primaryType: "nt:unstructured",
  jcr:createdBy: "admin",
  fileReference: "/content/dam/myapp/dev/hero-billboard.jpg",
  jcr:lastModifiedBy: "admin",
  jcr:created: "Wed Oct 07 2015 03:38:00 GMT+0000",
  jcr:lastModified: "Wed Oct 07 2015 16:54:12 GMT+0000",
  sling:resourceType: "myapp/components/content/image",
  cq:responsive: {
    jcr:primaryType: "nt:unstructured"
  },
    mobile: {
      jcr:primaryType: "nt:unstructured",
      path: "/content/dam/myapp/dev-testing/placeholder/FPO-hero-sm.jpg"
    },
    tablet: {
      jcr:primaryType: "nt:unstructured"
    },
    desktop: {
      jcr:primaryType: "nt:unstructured"
    },
    extralg: {
      jcr:primaryType: "nt:unstructured"
    }
}

So the part I am getting stuck on is how will I get the properties set on the mobile, tablet, desktop and extralg nodes.

I would like to reuse as much OOTB functionality I get from the utils/Image.js instead of rebuilding that so that why I have gone the Java route.

Solution

  • Why don't you use a WCMUse Java class or a JS use?

    What you are looking for is custom for what you are trying to achieve so you should have your own controller and access the properties of child nodes, Sightly is a templating language, it's made simple on purpose, if you need specific stuff create a Use Java or JavaScript object and access it with Sightly.