1

所以我有一个工作布局_layout.html（使用 Jinja2 v2.6 和 Flask），其中包括我的标题{% include 'header.html' %}和正文内容{% block content %}{% endblock %}（按此顺序）。

header.html

<ul>
    <li><a href="/about" {% if active_page == 'about' %} class="selected" {% endif %}>ABOUT</a></li>
</ul>

about.html

{% extends "_layout.html" %}
{% set active_page = 'about' %}

{% block content %}
    ...
{% endblock %}

问题是，由于子模板是全局的，并且在评估布局模板之前执行，因此class="selected"没有添加模板，因为header.html模板在其上下文中没有 active_page。

如果我将 header.html 内容放在主布局中一切正常，我怎样才能使用我拥有的包含和结构来让它工作？

编辑：

我也试过了{% include 'header.html' with context %}，{% from 'header.html' import input with context %}两者都不起作用。

4

3 回答 3

1

最简单的解决方法可能是只使用 JavaScript（在这种情况下为 JQuery）：

查询：

var currentPage = window.location.pathname;

$('nav ul li a').each(function(){
    if($(this).attr('href') == currentPage){
        $(this).addClass('selected');
    }
});

此函数会将选定的类添加到<a>与当前窗口位置匹配的标记中。

于 2013-11-13T12:17:35.407 回答
0

我就是这样做的：

在我的 _mainlayout

 {% block stylesheets %}
    Links to stylesheets go here
 {% endblock %}

 {% block main_body_area %}
        Replace with your html body
 {% endblock %}

 {% block scripts %}
    Add js scripts here
 {% endblock %}

然后在子模板中简单地执行以下操作：

{% extends "_mainlayout.html" %}

 {% block stylesheets %}   
    <style sheets go here/>
 {% endblock %}

 {% block main_body_area %}
    <your page content here/>
 {% endblock %}

 {% block scripts %}
    add any js scripts here
 {% endblock %}

然后，您可以在 head 部分添加您的 active_page，在我给您的示例中，我保存样式表。我这样做是因为在我的 _mainlayout 文件中，我有一个标准的 css 样式表，它用于所有页面，然后如果我需要额外的页面特定布局，我将它包含在该特定页面中，如果不只是将其留空。

js 文件也是如此，我不想在不需要它们的页面上加载脚本，因此可以轻松地将它们包含在需要特定 js 文件的页面上。

于 2013-01-18T13:18:37.473 回答
0

我刚刚在 Jinja2 2.8 版中遇到了同样的问题。将其升级到2.9 版解决了这个问题。

于 2017-05-31T01:03:24.820 回答