Получать результаты и повторять имена классов

Я пытаюсь создать forloop используя синтаксис Shopify Liquid, который будет подсчитывать возвращенные результаты изображений из определенного продукта и повторять уникальные классы div в каждом экземпляре, чтобы я мог использовать эти классы в качестве якорей для scrollto анимация.

В настоящее время я пытаюсь что-то вроде:

 <ul class="scroll-to-nav>
{% for image in product.images %}
<li class="scroll-to-nav-link><a href="#link">link</a></li>
{% endfor %}
</ul>

Желаемый результат будет что-то вроде:

<ul class="scroll-to-nav>
<li class="scroll-to-nav-link-1><a href="#link-1">link 1</a></li>
<li class="scroll-to-nav-link-2><a href="#link-2">link 2</a></li>
<li class="scroll-to-nav-link-3><a href="#link-3">link 3</a></li>
<li class="scroll-to-nav-link-4><a href="#link-4">link 4</a></li>
<li class="scroll-to-nav-link-5><a href="#link-5">link 5</a></li>
etc etc etc
</ul>


<img src="path-to-img.jpg" id="link-1">
<img src="path-to-img.jpg" id="link-2">
<img src="path-to-img.jpg" id="link-3">
<img src="path-to-img.jpg" id="link-4">
<img src="path-to-img.jpg" id="link-5">
etc etc etc

0

Решение

Как указано в комментарии Drip, информация доступна в документации. Вот способ достичь того, что вы хотите сделать:

{% for image in product.images %}
<a href="#" id="link{{ forloop.index }}">Link {{ forloop.index }}</a>
{% endfor %}

Если вам нужно узнать длину вашего цикла, вы можете использовать объект {% forloop.length%}.

1

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]