AEM Sightly 获取子节点的属性。

Question

所以看起来 sightly 非常适合获取属性，但我想获取我定义的其他子节点的属性。

这是我的 PictureFill 组件结构的开始：

{
  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"
    }
}

所以我遇到的问题是如何在移动设备、平板电脑、桌面设备和 extralg 节点上设置属性。

我想重用从 utils/Image.js 获得的尽可能多的 OOTB 功能，而不是重建它，所以我选择了 Java 路线。

Answer 1

为什么不使用 WCMUse Java class 或者 JS 使用？

您正在寻找的是针对您要实现的目标的自定义，因此您应该拥有自己的控制器并访问子节点的属性，Sightly 是一种模板语言，如果您需要特定的，它是有意简化的stuff 创建一个 Use Java 或 JavaScript 对象并使用 Sightly 访问它。

Answer 2

方法一：HTL/Sightly

用你的数据结构 question:

<sly data-sly-list.device="${resource.listChildren}">
  ${device.name} // this should output 'mobile' or 'desktop', etc.
  ${device.path} // this should output the paths
</sly>

---

方法二：Javascript USE API

这是我要访问的节点 (navbarnavitem) item0 和 item1:

这是帮助我做到这一点的 getLinks 方法（每个项目都有两个属性 - href 和 linkText:

祝你好运...