for loop inside twig.js, setting the loop counter

Question

I am using twig.js for templating. I have html div which displays 3 items from the items list.

<div class="item-container">
    {% set i = 0 %}
    {% for i in 0..items | length %}
    <ul>
        <li> {{ items[i].name }}     </li>
        <li> {{ items[i + 1].name }} </li>
        <li> {{ items[i + 2].name }} </li>
    <ul>
    {% set i = i + 3 %}
    {% endfor %} 
</div>

First iteration loop works fine, but $i will not be incremented using {% set i = i + 3 %}.
Can anyone tell me how to do this ?

Answer 1

Use range function, it has step argument:

<div class="item-container">
{% for i in range(0, items|length-1, 3) %}
    <ul>
        <li>{{ items[i] }}</li>
        <li>{{ items[i+1]|default }}</li>
        <li>{{ items[i+2]|default }}</li>
    </ul>
{% endfor %}
</div>

Instead of default filter you may use {% if items[i+1] is defined %}.