-1

我不确定这是 express 的问题，还是我对 nunjucks 做错了什么。我想创建一个模板层次结构，其中模板包含所有公共部分，特定页面扩展模板。由于某种原因，body 字段是块状的。如果我将扩展指令更改为包含在 template.nunj 中，一切正常，但我无法扩展标题。我还尝试在 template.nunj 和 index.nunj 中显式声明标题块并调用 super() 但由于某种原因，标题或正文为空白。

快速设置：

nunjucks.configure(path.resolve(__dirname, '.', 'views'), {
    autoescape: true,
    express: app,
    watch: true, 
    cache: false,
});

app.set('view engine', 'nunj');

布局.nunj：

<!DOCTYPE html>
<html lang="en">

{% extends './common/header.nunj' %}

<body>
    <div class="container">
        {% block mainContainer %} 
            <p>This should be working</p>
        {% endblock %}
    </div>
</body>

</html>

索引.nunj

{% extends 'layout.nunj' %}

{% block mainContainer %} 
    {{ super() }}
    <p>This should be rendering</p>
{% endblock %}

header.nunj

{% block header %}
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="/css/style.css">
        <title>Dari Dictionary</title>

    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

    </head>
{% endblock %}
4

1 回答 1

-1

根据http://jinja.pocoo.org/docs/dev/templates/#template-inheritance。您不能在子模板或纯 html 中添加新块。您必须使用基本模板中定义的块，在这种情况下是布局。

布局.nunj

<!DOCTYPE html>
<html lang="en">
    <head>
      {% block header %}
      {% endblock %}
    </head>
<body>
    <div class="container">
        {% block mainContainer %} 
            <p>This should be working</p>
        {% endblock %}
    </div>
</body>
</html>

header.nunj

{% extends 'layout.nunj' %}
{% block header %}
    <meta charset="UTF-8">
    <link rel="stylesheet" href="/css/style.css">
    <title>Dari Dictionary</title>

    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
{% endblock %}

索引.nunj

{% extends 'header.nunj' %}

{% block mainContainer %} 
    {{ super() }}
    <p>This should be rendering</p>
{% endblock %}
于 2016-12-11T02:47:21.043 回答