迭代（for循环）一目了然答案

【问题标题】：Iteration (for loop) in sightly迭代（for循环）一目了然
【发布时间】：2016-09-17 18:46:03
【问题描述】：

我在 jstl 中使用过<c:forEach>。现在我想用视力。

我的用例是打印从 1 到 10 的数字，那么我如何在 java 中像 for loop 一样进行迭代

【问题讨论】：

【解决方案1】：

Sightly 不允许您通过设计将任何逻辑放入其中。您应该做的是，您应该自定义您的基础模型，以便您可以检索包含需要显示的数据的不相关（从 Sightly 的角度）长度的准备列表。之后，只需使用data-sly-list。您需要谷歌了解更多详细信息，但总的来说，这是您在 Sightly 中使用列表的方式：

<ul data-sly-list.myitem="${mymodel.myitems}" data-sly-unwrap>
  <li>${myitem.foo}</li>
</ul>

编辑：正如@nateyolles 所指出的，您可以通过在测试条件（<li data-sly-test="${itemList.count >= 2 && itemList.count <= 6}">${item}</li>）中使用索引来迭代特定范围的项目，但我不确定这是否是“视觉方式”。就个人而言，我建议不要这样做，除非它会让你的生活明显更轻松。

【讨论】：

"澄清一下：您无法获取 myitems 列表并遍历项目 2 到 6...为此，您需要在模型中创建一个仅返回这些项目的 getter 并使用此 getter反而。”这不是一个很好的例子，因为您可以遍历 myitems 并使用 data-sly-test 仅显示项目 2 到 6。 <ul data-sly-list="${mymodel.myitems}"> <li data-sly-test="${itemList.count >= 2 && itemList.count <= 6}">${item}</li> </ul>
这不只是测试列表的大小是否在 2 到 6 个元素之间吗？
没有。 ul 上的 data-sly-list 将遍历整个列表，data-sly-test 将确定是否在每次迭代的最终 HTML 输出中包含或排除 li 元素。此示例将打印列表的第 2 到第 6 项。（我使用了从 1 开始的 count；我可以使用从 0 开始的 index。）
感谢您的澄清 - 没有注意到 list 和 itemList 之间的区别...我已将其添加到答案中。
好吧，这个答案的想法和一些补充帮助了我。 :)

【解决方案2】：

请看一下这个 AEM 论坛：- http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manager.topic.html/forum__wtot-hi_i_need_toite.html

具有固定数量的项目的循环

<ul data-sly-list="${ [1,2,3,4] }">
<li>${item}</li>
</ul>

还请查看文档：-

链接：- https://docs.adobe.com/docs/en/aem/6-1/develop/sightly/block-statements.html

列表

data-sly-list：为提供的对象中的每个可枚举属性重复宿主元素的内容。

这是一个简单的循环：

<dl data-sly-list="${currentPage.listChildren}">
    <dt>index: ${itemList.index}</dt>
    <dd>value: ${item.title}</dd>
</dl>

代码示例仅用于说明目的。

以下默认变量在列表范围内可用：

item：迭代中的当前项。

itemList：具有以下属性的对象：

索引：从零开始的计数器 (0..length-1)。

count：从一开始的计数器（1..length）。

first：如果当前项是第一项，则为 true。

middle：如果当前项既不是第一项也不是最后一项，则为 true。

last：如果当前项是最后一项，则为 true。

odd: 如果索引为奇数则为真。

偶数：如果索引是偶数则为真。

<ul data-sly-list.child="${currentPage.listChildren}">
  <li class="${ childList.odd ? 'odd' : 'even'}">${child.title}</li>
</ul>

<div data-sly-list.children="${resource.listChildren}">
    <div data-sly-list.fields="${children.listChildren}">
        <div data-sly-test=${fieldsList.last}> DO SOMETHING BEFORE LAST NODE</div>
        <div data-sly-resource="${fields.path}"></div>
    </div>
</div>

所以根据您的用例，您可以使用：

<ul data-sly-list.child="${currentPage.listChildren}">
   <li data-sly-test="${childList.index <= 5}">${child.title}</li>
</ul>

我希望这对你有用。

感谢和问候

考图克萨尼

【讨论】：