Question

我有一个简单的烧瓶应用程序，需要显示一个值表，单元格背景根据阈值的单元格值进行颜色编码。我正在生成表格内容如下：

  {% block dashboard_table2 %}
      <table>
      {% for row in data %}
          {% for item in row %}
              <td>{{ item }}</td>
          {% endfor %}
      </tr>
      {% endfor %}
      </table>
  {% endblock %}

我尝试在Python中将样式标记中的值包装起来，但它不起作用：

  if int(value) <= 10:
      value = '<p style="background-color:Red">' + value + '</p>'

我猜测页面的CSS覆盖了style属性。我也试过设置文本颜色属性而不是背景颜色但没有骰子。有什么建议可以做到这一点吗？我希望有一种简洁的方法来指定模板中没有硬编码的阈值。

Answer 1

最简单的方法是将此显示逻辑放在模板中：

<table>
    {% for row in data %}
    <tr>
        {% for item in row %}
            {% if item <= 10 %}
                <td class="under-limit">{{ item }}</td>
            {% else %}
                <td>{{ item }}</td>
            {% endif %}
        {% endfor %}
    </tr>
    {% endfor %}
</table>

然后，在您的CSS中，您可以使用：

.under-limit { background-color: red; }

Answer 2

<table>
   {% for row in row %}
       {% if item <= 10 %}
       <tr style ="background-color: red">
           <td> {{ item }} </td>
       </tr>
       {% else %}
       <tr>
           <td> {{ item }} </td>
       </tr>
       {% endif %}
    {% endfor %}
</table>

这对我有用。

使用Jinja模板基于单元格值对表格中的单元格进行颜色编码

2 个答案: