Jinja table，当列 == 值时，将 div 添加到特定列

Question

我有一个带有 jinja table 的烧瓶应用程序，当该行满足条件时，其中一列的值 = 1。

对于该列中出现 1 的每一行，我想将其替换为圆圈，例如：

如何将它添加到我的神社 table？

<table>
        <thead>

          <tr>
            {% for col in column_names %}
            <th>
            
              {{col}}
             
            </th>
            {% endfor %}
          </tr>

        </thead>
        <tbody>
          {% for row in row_data %}
          <tr>
            {% for col, row_ in zip(column_names, row) %}

  {% if loop.index == 1 %} 
            <td> 

IF  {{ row[16] }} == 1 then <div class="circle" style="float: left;">LB</div> 
else ''
end 

 {{row_}}</td>
{% else %}
            <td>{{row_}}</td>

 {% endif %}

            {% endfor %}
          </tr>
          {% endfor %}

         
        </tbody>
  
      </table>

HTML/CSS div 的代码我想出现在那个单元格

.circle
    {
    width:20px;
    height:20px;
    border-radius:10px;
    font-size:8px;
    color:#fff;
    line-height:20px;
    text-align:center;
    background:#000
    }

<div class="circle" style="float: left;">LB</div>

Answer 1

解决方案

试试下面的方法。

The one-line if-else statement in jinja2 looks like this:
{{ OUTPUT_WHEN_TRUE if condition else OUTPUT_WHEN_FLASE }}
So, in your case, the code within for each <td></td> (where loop.index == 1 over the inner loop) will look like this:
{{ '<div class="circle" style="float: left;">LB</div>' if row[16] == 1 else '' }} {{ row_ }}

代码

<table>
    <thead>

        <tr>
        {% for col in column_names %}
        <th>
        
            {{col}}
            
        </th>
        {% endfor %}
        </tr>

    </thead>
    <tbody>
        {% for row in row_data %}
        {% set row_loop = loop %}
        <tr>
        {% for col, row_ in zip(column_names, row) %}
        {% set col_loop = loop %}

        {# Choose which loop: row or col you are referring to #} 
        {% if col_loop.index == 1 %} 
        <td> 

            {{ '<div class="circle" style="float: left;">LB</div>' if row[16] == 1 else '' }} {{ row_ }}

        </td>
        {% else %}
            
            <td>{{ row_ }}</td>

        {% endif %}

        {% endfor %}
        </tr>
        {% endfor %}
     
    </tbody>
  
</table>

参考资料

Get loop index of outer loop
Jinja Docs - Accessing the parent Loop
Jinja shorthand conditional: one-line if-else

Jinja table，当列 == 值时，将 div 添加到特定列

Jinja table, when column == value then add div to specific column

javascript

python

jinja2

flask

解决方案

代码

参考资料