for-loop - 如何根据当前页面变量显示来自 Jekyll 数据文件的数据

Question

问题

我的 Jekyll 站点上有一个 div，我想在其中显示从 _data/book-data.yml 生成的数据，例如:

- name: johnson-everything-under
  title: Everything Under
  author: Daisy Johnson
  publisher: Faber & Faber
  pub-date: 12/12/2012

- name: johnson-train-dreams
  title: Train Dreams
  author: Denis Johsnon
  publisher: Granta
  pub-date: 01/01/2001

我正在尝试找到一种方法来显示对应于相关页面的数据(每本书条目都有不同的页面)，我认为如果 name 键这可能是可能的对应于 page.url 或其他一些页面变量。

我尝试过的

在工作页面上，我有一个包含以下 HTML 的 include:

<div class="book-meta">
  {% if page.category == "reviews"%}
  <div class="book-thumbnail">
    <img class="post-thumbnail-lg" src="{{ site.baseurl }}/assets/images/{{ page.thumbnail }}" alt="{{ page.thumbnail }}">
  </div>
  {% for book in site.data.book-data %}
  <div class="book-details">
    <ul class="book-meta-list">
      <li class="book-meta-item"><p><a href="#">{{ book.author }}</a></p></li>
      <li class="book-meta-item"><p><em>{{ book.title }}</em></p></li>
      <li class="book-meta-item"><p>{{ book.publisher }}</p></li>
      <li class="book-meta-item"><p>{{ book.pub-date }}</p></li>
    </ul>
  </div>
  {% endfor %}
  {% endif %}
</div>

CSS 并不重要，但目前上面 HTML 的输出是:

期望的输出

如您所见，输出包含 .yml 文件中的两个元数据 block 。我想找到一种方法，以便只显示相关的数据 block (本例中的第一个 block ):

可能的解决方案

我认为可能有一种方法可以将 page.variable 与 YAML block 名称相匹配，以便只输出正确的图书数据。类似的东西:

{% assign url_substring = page.url | split, '/' | last %}
// url_substring = johnson-everything-under
{% for book in site.data.book-data %}
{% if url_substring == book.name %}
// = true
<p>{{ book.title }}<p>
{% endif %}
{% endfor %}

除了我无法让它正常工作之外，我还可以看到 liquid 标签 {{ book.title }} 无法知道要输出哪个书名，即使 page.url 匹配。

我不确定我在这里是否走在正确的轨道上，所以如果有人对如何实现这一点有任何其他建议，我很想听听。提前致谢。

Answer 1

您可以使用 Jekyll 的 where 过滤器和智能包含:

{% assign book = site.data.book-data | where: 'title', include.title | first %}

<div class="book-meta">
  <div class="book-thumbnail">
    <img
      class="post-thumbnail-lg"
      src="{{ book.thumbnail | prepend: 'assets/images/' | relative_url }}"
      alt="{{ book.title }}"
    />
  </div>

  <div class="book-details">
    <ul class="book-meta-list">
      <li class="book-meta-item"><p><a href="#">{{ book.author }}</a></p></li>
      <li class="book-meta-item"><p><em>{{ book.title }}</em></p></li>
      <li class="book-meta-item"><p>{{ book.publisher }}</p></li>
      <li class="book-meta-item"><p>{{ book.pub-date }}</p></li>
    </ul>
  </div>
</div>

请注意，我还在数据文件中包含了缩略图信息..

然后只需将 title 参数传递给 include(在您的书页的布局中):

{% include books.html title = 'Everything Under' %}

如果您想呈现“列表”，则只需循环并呈现:

{% for book in site.data.book-data %}
  {% include books.html title = book.title %}
{% endfor %}