Условные классы элементов с jinja, я хочу, чтобы div получил класс, если элемент списка содержит определенный элемент

Я делаю небольшую доску вакансий, и у меня есть маленькие карточки для каждой работы. Эти карты динамически создаются из списка, отправленного из моего скрипта Python в html с помощью flask/jinja.

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 %}

Условные классы элементов с jinja, я хочу, чтобы div получил класс, если элемент списка содержит определенный элемент

Я бы хотел, чтобы выбранные карты выделялись или выделялись. Итак, в моем скрипте Python, откуда берутся задания, я добавил бинарную опцию. 1 = рекомендуемый, 0 = обычный

Итак, в моем html это будет выглядеть примерно так:

{% for item in jobs %}

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

{% endfor %}

поэтому он получит новый класс CSS, если для его ключевого параметра установлено значение 1.

Пример CSS

.featured {
    background-color: blue;
}
Почему в Python есть оператор "pass"?
Почему в Python есть оператор "pass"?
Оператор pass в Python - это простая концепция, которую могут быстро освоить даже новички без опыта программирования.
Некоторые методы, о которых вы не знали, что они существуют в Python
Некоторые методы, о которых вы не знали, что они существуют в Python
Python - самый известный и самый простой в изучении язык в наши дни. Имея широкий спектр применения в области машинного обучения, Data Science,...
Основы Python Часть I
Основы Python Часть I
Вы когда-нибудь задумывались, почему в программах на Python вы видите приведенный ниже код?
LeetCode - 1579. Удаление максимального числа ребер для сохранения полной проходимости графа
LeetCode - 1579. Удаление максимального числа ребер для сохранения полной проходимости графа
Алиса и Боб имеют неориентированный граф из n узлов и трех типов ребер:
Оптимизация кода с помощью тернарного оператора Python
Оптимизация кода с помощью тернарного оператора Python
И последнее, что мы хотели бы показать вам, прежде чем двигаться дальше, это
Советы по эффективной веб-разработке с помощью Python
Советы по эффективной веб-разработке с помощью Python
Как веб-разработчик, Python может стать мощным инструментом для создания эффективных и масштабируемых веб-приложений.
6
0
3 647
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 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%}

Другие вопросы по теме