在 Jekyll 中使用数据的正确方法答案

【问题标题】：Right way to use the data in Jekyll在 Jekyll 中使用数据的正确方法
【发布时间】：2015-09-07 08:54:37
【问题描述】：

目标是在特定页面的前端部分中使用定义的变量。

这是我的文件系统结构：

_组件

c1.html
c2.html

这里我已经定义了front-matters中的属性。

_包含 > 组件

c1.html

这里我想使用循环来引用_Components> c1.html页面中定义的变量。

我怎样才能实现这个目标？

在我的 _Includes > Components > c1.html 我有以下代码：

<body class="full">
    {% assign fullcomponents = site.components %}
        {% for component in fullcomponents | where:"title","c1html" %}
        {% component.title %}
    {% endfor %}
    <div class="container-fluid" id="componentscontainer">
        <div class="col-md-12">                 
            <div class="panel panel-primary" id ="panelcomponentlarge">
                <div class="panel-heading" >
                    Chart C3 Line
                </div>
etc...

我肯定遗漏了一些琐碎的事情。

第二次尝试

我发现我可以为此提供一个数据层，所以我尝试将这些信息拆分到一个新的数据文件中。

这里是components.json的内容

   {

    "Components": [
    "ChartC3Line":{
            "component":"ChartC3Line",
            "description":"This is an attempt"

        },
        "ChartC3Lines":{
            "component":"ChartC3Lines",
            "description":"This is an attempt"

        }
    ]

}

我正在尝试使用以下代码获取此信息：

    {% assign comp = site.data.components.Components[ChartC3Line] %}   

        HTML:

                        {% highlight html linenos%}

                            <p> Description: {{ comp.description }} </p>

但是什么都来了。

第三次尝试 我找到了一个解决方案，但我根本不喜欢我的新 json 文件

{

    "ChartC3":[ 
        {
            "component":"ChartC3Line",
            "description":"This is an attempt"

        }],
    "ChartC4":[ 
        {
            "component":"ChartC3Line",
            "description":"This is an attemptSSSSSSS"

        }]


}

我不想拥有一个元素的多个数组的对象！这里是检索正确信息的代码：

{% assign comp = site.data.components.ChartC4[0] %}   

            HTML:

                            {% highlight html linenos%}

                                <p> Description: {{ comp.description }} </p>

【问题讨论】：

标签： html jekyll liquid

【解决方案1】：

已解决 遵循 json 文件的结构，我以更简单的方式更改了结构：

{

"ChartC3":
    {
        "component":"ChartC3Line",
        "description":"This is an attempt"

    },
"ChartC4": 
    {
        "component":"ChartC3Line",
        "description":"This is an attemptSSSSSSS"

    }

} 现在我可以轻松访问正确的对象了。

{% assign comp = site.data.components.ChartC3 %}

        HTML:

                        {% highlight html linenos%}

                            <p> Description: {{ comp.description }} </p>

【讨论】：