1

我试图在我的帖子字体问题中循环嵌套列表并为每个嵌套项目显示关联的图像(使用 svg)

前置事项:

---  
layout: post
title: title of this post
spec:
- name: tee
- name: mobile
---  

在我的 post.html 文件中使用 for 循环

<div>
    <h4>specs</h4>

    {% for item in page.spec %}
    <svg class='spec-icon'><use xlink:href="#icons_{{item.name}}"/</svg>
    {% endfor %}

</div>

我希望这个呈现如下

 <div>
     <h4>specs</h4>

     <svg class='spec-icon'><use xlink:href="#icons_tee"/></svg>
     <svg class='spec-icon'><use xlink:href="#icons_mobile"/></svg>

 </div>

对于 spec: 下的每个嵌套 name:vale 对,我希望有一个唯一的 svg 元素,该元素使用 #id 中包含的嵌套值创建

???

4

1 回答 1

2

尝试这个:

---  
layout: post
title: title of this post
spec: [tee, mobile]
---  

然后:

<div>
    <h4>specs</h4>

    {% for item in page.spec %}
    <svg class='spec-icon'><use xlink:href="#icons_{{ item }}"/</svg>
    {% endfor %}

</div>

希望有所帮助!让我知道这是否有效,是吗?

于 2016-02-11T19:21:25.593 回答