Question

我正在开发一款在Nunjucks中具有某些重复UI模式的Marionette应用程序，例如：

<div class="custom-input-group">
    <input name="username" type="text" id="username" required value="{{ username }}">
    <span class="highlight"></span>
    <span class="bar"></span>
    <label>Username</label>
</div>
<div class="custom-input-group">
    <input name="first_name" type="text" id="first_name" required value="{{ first_name }}">
    <span class="highlight"></span>
    <span class="bar"></span>
    <label>First Name</label>
</div>
<div class="custom-input-group">
    <input name="last_name" type="text" id="last_name" required value="{{ last_name }}">
    <span class="highlight"></span>
    <span class="bar"></span>
    <label>Last Name</label>
</div>

我想将其抽象为macro或部分模板，如下所示：

{% macro field(name, label='', type='text') %}
    <div class="custom-input-group">
        <input name="{{ name }}" type="{{ type }}" id="{{ name }}" required value={{ name }}>
        <span class="highlight"></span>
        <span class="bar"></span>
        <label>{{ label }}</label>
    </div>
{% endmacro %}

所以我可以像这样使用它：

{{ field('username', 'Username') }}
{{ field('first_name', 'First Name') }}
{{ field('last_name', 'Last Name') }}

但是，这会生成value="username"而不是value="{{ username }}"。我怎样才能生产后者？

Answer 1

啊，我明白了。我不必尝试输出另一个模板，而是将最终值传递给宏本身，如下所示：

{% macro field(value, name, label='', type='text') %}
    <div class="custom-input-group">
        <input name="{{ name }}" type="{{ type }}" id="{{ name }}" required value={{ value }}>
        <span class="highlight"></span>
        <span class="bar"></span>
        <label>{{ label }}</label>
    </div>
{% endmacro %}

然后像这样使用宏：

{{ field(username, 'username, 'Username') }}
{{ field(first_name, 'first_name', 'First Name') }}
{{ field(last_name, 'last_name', 'Last Name') }}

这仍然比我想要的干一点，但比以前更好。

Nunjucks中的Metatemplating

1 个答案: