Question

我意识到有几个类似的问题已被问到，但是他们并没有特别关注我想要做的事情而且我几乎是一个初学者，所以答案看起来比我想象的更先进。

我正在努力将带有Python代码的Jinja2模板实现到我参加此课程时一直保留的HTML页面中。

因此...

我尝试模板和重复的html块具有以下结构：

<h1>Stage Number</h1>
<div class = "lesson"> 
  <h2>Lesson Number</h2> 
     <div class="concept">
       <div class="concept-title"> Title </div>
         <div class="concept-description">
           <p>Description paragraph</p>
           <p>Description paragraph</p>
         </div>
    <div class="concept-title"> Title</div>
      <div class="concept-description">
        <p>Description paragraph</p>
      </div>
    </div>
</div>

对于每个阶段，课程编号各不相同，每个标题都有不同数量的描述段落。

我的代码在Github上（这是一个经过编辑的版本）：https://github.com/graceehayden/Stage4Udacity-Session-2/blob/master/templates/index.html

我的main.py文件有模板代码，应该在index.html文件中实现。

这门课程对我来说很重要，重新观看视频或找到关于模板的其他YouTube教程并不是很有帮助，因为很多它比我现在看起来更先进。

任何有关如何理顺变量的帮助或指示，以便它们与index.html文件正确关联，我们将非常感激。当我假装我没有那么多输入时，我能够制作一个简单的单变量工作并在我运行应用程序时显示，但由于我现在和需要的复杂性，它不起作用

Answer 1

到目前为止，您似乎对代码大多有正确的想法。缺少的重要一点是，您需要数据类型作为序列来扩展它以在此处执行您想要的操作。

每节课都有一个带有相关描述的概念列表。

concept1 = {
    'name' : 'concept1',
    'description1' : 'This is the description for concept1!',
}

lesson1 = {
     'name' : 'lesson1',
     'concepts': [concept1, concept2] #the list here lets us have more than one value
}

然后每个Stage都是一个包含不同课程列表的数据结构。

stage1 = {
     'name' : 'stage1',
     'lessons': [lesson1, lesson2],
}

最后，您将所有这些不同的阶段填入template_values

template_values = {
    'stages' : [stage1, stage2],
}

然后您需要模板来访问嵌套数据：

{% for stage in stages %}
//do things with this particular stage
    {% for lesson in stage['lessons'] %}
        //do things with this lesson
        {% for concept in lesson['concepts'] %}
            //do things with individual concepts
        {% endfor %}
    {% endfor %}
{% endfor %}

注意：尚未测试模板，因此可能在访问字典时犯了一些错误。

如何重复Jinja2模板的部分

1 个答案: