使用nunjucks或其他方法的嵌套变量的模板解决方案

时间:2016-06-09 11:47:54

标签: javascript npm gulp template-engine nunjucks

我刚刚开始使用gulp& nunjucks用于模板化(在这种情况下是电子邮件)。

我想解决调用模块/部分的问题,并在每次处理时为属性分配不同的值。

它最初似乎是一个for循环的工作,但模块不一定会在模板中按顺序调用

在模块中,有一些属性被分配给变量。 我想根据模块使用的部分以不同方式解决这些变量。

一个非常基本的例子是 - 在我有的索引文件中:

{% block content %}


<!-- logo start -->

{% include genericMod %}

<!-- logo end -->


<!-- some other section start -->

{% include someOtherMod %}

<!-- some other section end -->


<!-- hero start -->

{% include genericMod %}

<!-- hero end -->


{% endblock %}

在genericMod本身 - :

<tr>

 <td class="full-width-image" align="{{align}}" ><img src="{{src}}" alt="{{alt}}"/></td>

</tr>

我想要利用的功能是定义一个“modKey”,即模块中每个变量的变量 例如

{{modKey.align}}

{{modKey.src}}

{{modKey.alt}}

然后能够以某种方式在每次调用时将该键分配给模块:

<!-- logo start —>

{% include genericMod "modKey": "logo" %}

<!-- logo end -->

以上产生:

<tr>

 <td class="full-width-image" align="{{logo.align}}" ><img src="{{logo.src}}" alt="{{logo.alt}}"/></td>

</tr>

<!-- hero start -->

{% include genericMod "modKey": "hero" %}

<!-- hero end -->

产生:

<tr>

 <td class="full-width-image" align="{{hero.align}}" ><img src="{{hero.src}}" alt="{{hero.alt}}"/></td>

</tr>

因此,当通过json文件传送时,将为每个属性变量呈现相应的数据:

"logo": {
    "alt": "some logo alt text",
    "href": "http://www.someurl.com",
    "align": "left"
  },
 "hero": {
    "alt": "some hero alt text",
    "href": "http://www.someotherurl.com",
    "align": "centre"
  }

显然,这只是一个假设的解决方案,但有没有办法实际实现类似的东西呢?

1 个答案:

答案 0 :(得分:1)

事实证明解决方案非常简单。在尝试使用&#39; set&#39;时,我一直在将字符串var的值赋给字符串而不是变量名。

对于记录,这是有效的......

{% set data = logo %} 
{% include oneIncludeFile %} 
{% set data = hero %} 
{% include otherIncludeFile %}

包含文件将引用的位置,例如{{data.alt}}或{{data.href}}。

虽然宏可能是实现这一目标的更好方法:

{% macro foo(data) %} 
<a href="{{ data.href }}"><img src="{{ data.src }}" alt="{{ data.alt }}" /></a> 
{% endmacro %}

然后将其称为{{ foo(logo) }}{{ foo(hero) }},以传递不同的数据集。

可在此处找到完整说明:https://github.com/mozilla/nunjucks/issues/779