如何在 AEM 上迭代第二级多字段

问题描述 投票：0回答：1

我正在使用 Adobe Experience Manager。我需要构建的是一个组件，用户可以在其中创建一定数量的容器，并且在每个容器内部，他们可以创建任意数量的信息卡。在我的 

.content.xml
文件夹的 
_cq_dialog
文档中，我有：

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
          xmlns:nt="http://www.jcp.org/jcr/nt/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0"
          jcr:primaryType="nt:unstructured"
          jcr:title="Tabs and Content"
          sling:resourceType="cq/gui/components/authoring/dialog"
          extraClientlibs="[project.base]">
    <content jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container">
        <items jcr:primaryType="nt:unstructured">
            <tabs jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/tabs">
                <items jcr:primaryType="nt:unstructured">
                    <properties jcr:primaryType="nt:unstructured" jcr:title="Tabs" sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns" margin="{Boolean}true">
                        <items jcr:primaryType="nt:unstructured">
                        <column jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container">
                            <items jcr:primaryType="nt:unstructured">
                                <card
                                jcr:primaryType="nt:unstructured"
                                fieldlabel="General"
                                sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                                composite="{Boolean}true">
                                    <field jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/fieldset" name="./tabsGroup">
                                        <items jcr:primaryType="nt:unstructured">
                                            <titleTab jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/textfield" fieldLabel="Titulo de la tab" name="./titleTab"/>
                                        </items>
                                    </field>
                                </card>
                            </items>
                        </column>
                        </items>
                    </properties>
                    <cardBlock jcr:primaryType="nt:unstructured" jcr:title="Content" sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns" margin="{Boolean}true">
                        <items jcr:primaryType="nt:unstructured">
                            <column
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/coral/foundation/container">
                                <items jcr:primaryType="nt:unstructured">
                                    <cardBody
                                            jcr:primaryType="nt:unstructured"
                                            fieldlabel="Contenedor de cards"
                                            sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                                            composite="{Boolean}true">
                                        <field jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/fieldset" name="./contentGroup">
                                            <items jcr:primaryType="nt:unstructured">
                                                <titleBlock jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/textfield" fieldLabel="Titulo del bloque" name="./titleBlock"/>
                                                <cardData
                                                        jcr:primaryType="nt:unstructured"
                                                        fieldlabel="Contenedor de cards"
                                                        sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                                                        composite="{Boolean}true">
                                                    <field jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/fieldset" name="./contentData">
                                                        <items jcr:primaryType="nt:unstructured">
                                                            <image
                                                                    jcr:primaryType="nt:unstructured"
                                                                    sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
                                                                    fieldLabel="Image URL"
                                                                    rootPath="/content/dam/project"
                                                                    name="./image">
                                                            </image>
                                                            <altImage
                                                                    jcr:primaryType="nt:unstructured"
                                                                    sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                                                                    fieldLabel="Alt image"
                                                                    name="./altImage"/>
                                                            <clientName
                                                                    jcr:primaryType="nt:unstructured"
                                                                    sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                                                                    fieldLabel="Mes"
                                                                    name="./clientName"/>
                                                        </items>
                                                    </field>
                                                </cardData>
                                            </items>
                                        </field>
                                    </cardBody>
                                </items>
                            </column>
                        </items>
                    </cardBlock>
                </items>
            </tabs>
        </items>
    </content>
</jcr:root>

如您所见，为了达到我的需要，我必须在另一个多字段中添加一个多字段。我的问题是我无法获取第二个多字段内的信息。我的java模型看起来像：

package com.project.core.models;

import org.apache.sling.api.resource.Resource;
import org.apache.sling.models.annotations.DefaultInjectionStrategy;
import org.apache.sling.models.annotations.Model;
import org.apache.sling.models.annotations.injectorspecific.ChildResource;

import java.util.Collections;
import java.util.List;

@Model(adaptables = Resource.class, defaultInjectionStrategy = DefaultInjectionStrategy.OPTIONAL)
public class TabsAndContentModel {

    @ChildResource
    private List<Resource> tabsGroup;

    @ChildResource
    private  List<Resource> contentGroup;

    public List<Resource> getTabsGroup() {
        return Collections.unmodifiableList(tabsGroup);
    }

    public List <Resource> getContentGroup() {
        return Collections.unmodifiableList(contentGroup);
    }

}

使用 

tabsGroup
我正在获取容器的标题，使用 
contentGroup
我正在尝试获取卡片信息。我尝试像这样迭代，但没有成功：

<sly data-sly-use.model="com.project.core.models.TabsAndContentModel">

    <div>
        <div>
            <div id="tabs-one" >
                <ol role="tablist" 
                    aria-multiselectable="false">
                    <sly data-sly-list.b="${model.tabsGroup}">
                        <li role="tab" id="tab1"                            
                            tabindex="0" data-tab-index="0">${b.titleTab}</li>
                    </sly>
                </ol>
            </div>
        </div>
        <div>
            <sly data-sly-list.cardData="${model.contentGroup}">
                <div>
                    <div>
                        <div>
                            <div>
                                <div>
                                    <h2>
                                        ${cardData.titleBlock}</h2>
                                </div>
                            </div>
                        </div>
                        <div>
                            <div>
                                <div>
                                    <div>
                                        <div>
                                            <select>
                                                <option value="all">All</option>
                                                <option value="2024">2024</option>
                                                <option value="2023">2023</option>
                                                <option value="2022">2022</option>
                                                <option value="2021">2021</option>
                                                <option value="2020">2020</option>
                                                <option value="2019">2019</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <sly data-sly-list.cardData="${model.contentGroup}">
                    <div>
                        <div>
                            <div>
                                <div>
                                    <div>
                                        <img src="${cardData.image}" alt="${cardData.altImage}">
                                    </div>

                                </div>
                            </div>
                            <div>
                                <h6>${cardData.name}</h6>
                            </div>
                        </div>
                    </div>
                </sly>
            </sly>
        </div>
    </div>

</sly>

有人可以帮助我或指导我吗？我只需要一种迭代 

contentGroup
来获取信息并将其显示在前端的方法。

提前致谢

java aem sling aem-6
1个回答
0
投票

有多种方法可以实现您的用例。 假设你的节点结构看起来像 -

-- tabsGroup
      - item0
      - item1
      - item2
-- contentGroup
      - item0 [titleBlock = "something"]
          - contentData
              - item0 [image, altImage, clientName]
              - item1 [image, altImage, clientName]
              - item2 [image, altImage, clientName]
      - item1 [titleBlock = "something2"]
          - contentData
              - item0 [image, altImage, clientName]
              - item1 [image, altImage, clientName]
              - item2 [image, altImage, clientName]              
      - item2 [titleBlock = "something3"]
          - contentData
              - item0 [image, altImage, clientName]
              - item1 [image, altImage, clientName]
              - item2 [image, altImage, clientName]

最简单的一个是-

  1. 创建 2 个 SlingModel，一个用于 ContentGroup，一个用于 ContentData
  2. 将 PostConstruct 添加到您的 TabsAndContentModel，循环访问 @ChildResource 中的 contentGroup 列表，并针对每个资源将其调整为 ContentGroup.class
  3. 在ContentGroup sling模型中使用@ChildResource contentData并以相同的方式通过contentData实现PostConstruct循环，使每个内容适应ContentData.class
  4. 为元素提供相关的getter
  5. 这样您将能够访问嵌套的多字段信息

旁注 - 您的对话框包含两个多字段，其中一个是嵌套多字段，这使得创作变得复杂，并且随着多字段中条目的增加，它将导致用于编辑的组件对话框的加载问题。 如果可能的话，使用内容片段或可组合创作（带有嵌套容器[内容组]的选项卡组件[选项卡组]和内容数据的预告片/自定义组件）或符合您的功能需求的某些变体来重新设计此体验。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.