{% if loop.first %} and {{ loop.index0 }} not working with Matrix

Question

I have a problem with {% if loop.first %} and {{ loop.index0 }} with the following snippet:

{% for block in entry.locationSlideshow %}
  {% switch block.type %}
    {% case 'upload' %}
      {% for image in block.image %}
        <button {% if loop.first %}class="is-active" {% endif %}data-slide="{{ loop.index0 }}"><span class="show-for-sr">{{ image.title }}</span></button>
      {% endfor %}
  {% endswitch %} 
{% endfor %}

The problem is that all buttons get the class is-active and 0 instead of 0, 1, 2, 3...

This is working fine outside of a Matrix field. Any ideas what I am doing wrong here?

Regards
Ben

Answer 1

At the moment loop.first and loop.index0 are relative to your block.image loop.

If you want them to be set based on your entry.locationSlideshow loop (the parent loop) you can use {{ loop.parent.loop.index0 }} and {{ loop.parent.loop.first }}

For more information see the Twig documentation.