使用Jinja的条件元素类，如果列表项包含某个项，则我希望div获得一个类

Question

我正在做一个小小的工作委员会，而我的每张工作卡都很少。这些卡是使用flask / jinja从我的python脚本发送到html的列表中动态创建的

jobs = [{'title':'fix car', 'description':'my car broke down', 'price':100}]

HTML示例

{% for item in jobs %}

<p> {{ item['title'] }} {{ item['description'] }} {{ item['price'] }} </p>

{% endfor %}

我希望能够使选定的卡片突出或突出。因此，在作业来自的Python脚本中，我添加了一个二进制选项。 1 =精选，0 =正常

所以在我的html中，它看起来像这样：

{% for item in jobs %}

<p class='featured if item['featured']'> {{ item['title'] }} {{ item['description'] }} {{ item['price'] }}

{% endfor %}

因此，如果其功能键设置为1，它将获得一个新的CSS类。

CSS示例

.featured {
    background-color: blue;
}

Answer 1

您可以使用内联条件来缩短结果：

<p class='{{"featured" if item["featured"] else "normal"}}'> {{ item['title'] }} {{ item['description'] }} {{ item['price'] }}</p>

但是，如果您不想包括非功能卡的类，则可以使用通用的if-else语句：

{%if item["featured"]%}
  <p class='featured'> {{ item['title'] }} {{ item['description'] }} {{ item['price'] }}</p>
{%else%}
  <p> {{ item['title'] }} {{ item['description'] }} {{ item['price'] }}</p>
{%endif%}