从 YML 中获取数据答案

【问题标题】：getting data out of YML从 YML 中获取数据
【发布时间】：2015-02-11 08:11:36
【问题描述】：

你好 Stack Overflow 社区，

我试图在悬停时包含一个 html 图标。这是我的代码：

<div class="country">{% include icons/home/icon-america.html %}</div>

这很好用，但每次悬停时图标必须不同，所以我尝试了这个：

<div class="country">{% include icons/home/icon-{{project.country}}.html %}</div>

这是我的 YML：

home:
- {folder: 'thumb_1', name: 'Chaffee', text: 'Hier komt tekst over de chaffee en nog meer', link: 'chaffee.html', country: 'america'}

这不工作，有没有办法让这个工作？提前致谢。

这是我的 HTML

  <div class="thumb-container">

        {% for project in site.data.settings.home %}

        <a href="{{project.link}}" class="thumb-unit">

            <div class="backPic" style="background-image:  url(assets/img/home/{{ project.folder}}/thumb.jpg)"></div>
            <h3>{{ project.name}}</h3>
            <p>{{ project.text}}</p>
            <div class="thumb-overlay"></div>
            <div class="country">{% include icons/home/icon-america.html %}</div>

        </a>

        {% endfor %}

    </div>

维姆

【问题讨论】：

不是很清楚你想做什么。 {{project.country}} 来自哪里？它是for 变量中的site.home 循环吗？你能展示你的icons/home/icon-???模板吗？
{{project.country}} 来自我的 YAML “icon-america.html”只是一个 html（其中包含 SVG）文档，我一直在尝试链接，但我也有“ icon-museum.html"、"icon-russia.html" 等等。我有多个 div 都必须显示某个图标。
好的，我明白了。您的链接指向网站页面或外部页面（例如：github，...）？
上面的 HTML 工作正常，但它只在每个 div 上显示“icon-america.html”。我有一个 div 必须显示“icon-ussr.html”另一个“icon-museum.html”等等。我不知道我解释得对不对，但我是荷兰人，这是我能用英语做的最好的事情。
你能把你的代码放到 github 仓库吗？

标签： yaml jekyll

【解决方案1】：

我通过将 svg 放在一个单独的文件夹中解决了这个问题，并像这样链接到它们：

{folder: 'thumb_1', country: 'america', name: 'M24 Chaffee', text: 'Hier komt tekst over de chaffee en nog meer', link: 'chaffee.html'}

和这样的html：

<img src="assets/img/home_icons/{{ project.country}}/icon.svg" alt="" />

【讨论】：