Jekyll中的液体嵌套For-Loop语法问题

Question

第一次发帖，所以提前感谢您的时间c:

我正在使用杰基尔为投资组合服务。我正在使用一个投资组合插件以及一个名为Lightbox的JS库。我有投资组合插件工作。理想的操作是每次用户点击项目组合项目时，它都会执行灯箱（这是有效的）。为了将更多图像存储在灯箱中，我必须为它们提供相同的数据标题名称。

我的理解是我需要在当前循环中嵌套for循环，以检查数组中的所有项目以返回任何其他灯箱项目。

我的.yml文件如下所示：

title: Portfolio Title
description: A crazy portfolio item
bg-image: Test-01.png
lb-images:
  - Test-01.png
  - Test-02.png
  - Test-03.png`

我的.md文件如下所示：

<div class="flex-container">
  <!-- portfolio-item -->
{% assign projects = site.data.projects | get_projects_from_files | sort:'date' %}
{% for project in projects reversed %}

    <div class="flex-item" style="background-image: url(/img/projects/{{ project.bg-image }}); background-repeat: no-repeat">
      <a href="../images/projects/{{ project.lb-images[0] }}" data-lightbox="{{ project.title }}" data-title="{{ project.bg-image }}">
      <div id="overlay">
        <span id="reveal-text">
          <h3>{{ project.title }}</h3>
          <p>{{ project.description }}</p>
          <p>{{ project.category }}</p>
        </span>
      </div>
      </a>
    </div>

    {% for project in projects %}
    <a href="../images/projects/{{ project.lb-images[{{forloop.index}}] }}" data-lightbox="{{ project.title }}" data-title="{{ project.bg-image }}"></a>
    {% endfor %}

{% endfor %}
</div>

我认为forloop.index将从[1]开始，然后继续通过该数组，直到不再有lb-images。但有些事情发生了。我的猜测是语法或我如何调用.yml文件中的数据，或两者兼而有之。

再次感谢您的时间。

丹尼尔

（编辑：在嵌套endfor循环中取出空格，现在运行但返回：href="../images/projects/] }}"和data-title以及data-lightbox返回每个data.project文件而不是data.project.lb-images）

中的每个项目

Answer 1

为项目公开图像的正确循环是：

{% assign projects = site.data.projects | get_projects_from_files | sort:'date' %}

<div class="flex-container">
  {% for project in projects reversed %}
    <!-- portfolio-item -->
    <div class="flex-item" style="background-image: url(/img/projects/{{ project.bg-image }}); background-repeat: no-repeat">
      <a href="../images/projects/{{ project.lb-images[0] }}" data-lightbox="{{ project.title }}" data-title="{{ project.bg-image }}">
      <div id="overlay">
        <span id="reveal-text">
          <h3>{{ project.title }}</h3>
          <p>{{ project.description }}</p>
          <p>{{ project.category }}</p>
        </span>
      </div>
      </a>
    </div>
    {% for img in project.lb-images %}
      {% if forloop.first != true %}
        <a href="../images/projects/{{ img }}" data-lightbox="{{ project.title }}" data-title="{{ project.bg-image }}"></a>
      {% endif %}
    {% endfor %}
  {% endfor %}
</div>

Liquid forloop documentation