twigdrupal-8paragraph

How to loop a paragraph list (entity reference revisions list) in twig drupal 8

How to loop a list of paragraphs and get each field values?

I've built a paragraph that includes other paragraphs. Now i need to go trough them and get their values to list them into a twig template

Imagine structure of paragraph has this fields

  1. title
  2. description

  3. paragraph:

    1. Title
    2. Description
    3. Start date
    4. End date

My field.html.twig file looks like

{% if label_hidden %}
  {% if multiple %}
    {% for item in items %}
      {{ item.content }}
    {% endfor %}
  {% else %}
    {% for item in items %}
      {{ item.content }}
    {% endfor %}
  {% endif %}
{% else %}
  <div{{ title_attributes }}>{{ label }}</div>
  {% if multiple %}
    {% endif %}
    {% for item in items %}
      {{ item.content }}
    {% endfor %}
    {% if multiple %}
  {% endif %}
{% endif %}

My paragraph--name.html.twig looks like

<div class="row">
  <div class="col-sm-8 col-md-offset-2">
    <div class="section-title">
      <h2>{{ content.field_skill_title }}</h2>
      <p>{{ content.field_skill_description }}</p>
    </div>
  </div>
</div>
<div class="row">
  <div class="col-sm-8 col-md-offset-2">
    {# HERE SHOULD GO THE LOOP WITH REST 3 PARAGRPAHS #}
  </div>
</div>

My question is how should i implement the loop to display the values into template?

Solution 

  • <div class="row">
  <div class="col-sm-8 col-md-offset-2">
    <div class="section-title">
      <h2>{{ content.field_skill_title }}</h2>
      <p>{{ content.field_skill_description }}</p>
    </div>
  </div>
</div>
<div class="row">
  <div class="col-sm-8 col-md-offset-2">
    {# HERE SHOULD GO THE LOOP WITH REST 3 PARAGRPAHS #}
    {% for key, item in content.field_name_here if key|first != '#'%}
     {{ item['#paragraph'].field_title[0].value|raw }}
     {{ item['#paragraph'].field_description[0].value|raw }}
     {{ item['#paragraph'].field_start_date[0].value|raw }}
     {{ item['#paragraph'].field_end_date[0].value|raw }}
    {% endfor %}
  </div>
</div>