Итерация (для цикла) в виде

Я использовал <c:forEach> в JSTL. Теперь я хочу использовать зрение.

Мой сценарий состоит в том, чтобы печатать числа от 1 до 10, тогда как я могу повторять визуально, как for loop в Яве

2 ответа

Решение

Sightly не позволяет вам придумать логику в дизайне. Что вы должны сделать, так это то, что вы должны настроить базовую модель так, чтобы вы могли получить подготовленный список несоответствующей (с точки зрения Sightly) длины, который содержит данные, которые должны отображаться. После этого просто используйте data-sly-list, Вам нужно будет зайти в Google для получения более подробной информации, но в целом вы используете списки в 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>), хотя я не уверен, является ли это "прицелом". Лично я бы посоветовал этого не делать, если это не сделает вашу жизнь заметно проще.

Пожалуйста, обратите внимание на этот форум 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: повторяет содержимое элемента host для каждого перечисляемого свойства в предоставленном объекте.

Вот простой цикл:

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

Образцы кода предназначены только для иллюстрации.

В области списка доступны следующие переменные по умолчанию:

item: текущий элемент в итерации.

itemList: Объект, содержащий следующие свойства:

индекс: счетчик с нуля (0.. длина-1).

count: счетчик с одним основанием (длина 1.)

first: true, если текущий элемент является первым элементом.

middle: true, если текущий элемент не является ни первым, ни последним.

last: true, если текущий элемент является последним.

odd: true, если индекс нечетный.

even: true, если индекс четный.

//

<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>

Я надеюсь, что это будет работать для вас.

Спасибо и С уважением

Каутук Сахни

Другие вопросы по тегам