如何在 Flask 中使用 for 循环构建 HTML 表格？

发布于 2025-01-09 04:07:58 字数 2242 浏览 0 评论 0原文

我正在尝试使用 python 和 Flask 在网页上创建一个表格。我有两个列表，testing_sketches 和 split_reconstructions。

testing_sketches：它是一个大小为14的列表，包含14个图像地址。

split_reconstructions：它是一个列表列表，包含 14 个长度为 20 的列表。基本上，有 20 个图像地址对应于上一个列表中的 14 个图像中的每一个。这意味着 testing_sketches 中的每个图像地址包含 20 个图像地址。

我正在尝试迭代地从 testing_sketches 获取图像，并在其右侧的 split_reconstructions 中显示其 20 个图像。类似于以下内容：

我尝试使用以下代码来实现它：

<body>        
    <h2 style="margin-left: 1.5%;">Iterative Reconstructions</h2>
    {% for i in range(len(testing_sketches)) %}
            <br>
            <br>
            <h3 style="margin-left: 10%;">{{ i+1 }}.</h3>
            <center><table border="1">
            <COLGROUP>
            <COL width="100"><COL width="100">
            <THEAD>
            <tr>
                <td><center><b>Image<b></center><a href={{  testing_sketches[i] }} title="Input" class="thickbox"><img src={{  testing_sketches[i] }} alt="Sorry, No Display!" border="0"/></a></td>
                {% for j in range(20) %}
                <td><center><b>Reconstruction-{{ j }}<b></center><a href={{  split_reconstructions[i][j] }} title="Reconstructed-{{ iter_count }}" class="thickbox"><img src={{  split_reconstructions[i][j] }} alt="Sorry, No Display!" border="0"/></a></td>
                {% endfor %}
            </tr>
            </table></center>
    {% endfor %}   
    
</body>

但这会导致空白结果，没有备用显示，没有错误，只是一个空结果。我尝试检查我传递的列表的长度，所有列表都非空并且具有正确的图像地址，格式为：static/test_reconstructions/images/image_04666_img.png (地址之一的示例）

我传递 app.py 文件中使用的列表和函数，如下所示：

@app.route('/')
def home():

    return render_template('iterative_reconst.html', testing_sketchs=testing_sketchs, split_reconstructions=split_reconstructions, 
    len=len, range=range)

原文

I am trying to create a table on a webpage using python and flask. I have two lists, testing_sketches and split_reconstructions.

testing_sketches: It is a list of size 14, containing 14 image addresses.

split_reconstructions: It is a list of lists containing 14 lists of length 20. Basically, there are 20 image addresses corresponding to each of the 14 images in the previous list. This means it includes 20 image addresses for each image address in testing_sketches.

I am trying to iteratively take an image from testing_sketches and display its 20 images in split_reconstructions on its right. Something like the following:

And I have tried to implement it using the following code:

<body>        
    <h2 style="margin-left: 1.5%;">Iterative Reconstructions</h2>
    {% for i in range(len(testing_sketches)) %}
            <br>
            <br>
            <h3 style="margin-left: 10%;">{{ i+1 }}.</h3>
            <center><table border="1">
            <COLGROUP>
            <COL width="100"><COL width="100">
            <THEAD>
            <tr>
                <td><center><b>Image<b></center><a href={{  testing_sketches[i] }} title="Input" class="thickbox"><img src={{  testing_sketches[i] }} alt="Sorry, No Display!" border="0"/></a></td>
                {% for j in range(20) %}
                <td><center><b>Reconstruction-{{ j }}<b></center><a href={{  split_reconstructions[i][j] }} title="Reconstructed-{{ iter_count }}" class="thickbox"><img src={{  split_reconstructions[i][j] }} alt="Sorry, No Display!" border="0"/></a></td>
                {% endfor %}
            </tr>
            </table></center>
    {% endfor %}   
    
</body>

But this results in a blank result, no alternate display, no error, just an empty result. I have tried to check the length of the lists that I am passing on, and all of them are non-empty and have correct image addresses of the form: static/test_reconstructions/images/image_04666_img.png (an example of one of the addresses)

I pass the lists and the functions used in the app.py file as follows:

@app.route('/')
def home():

    return render_template('iterative_reconst.html', testing_sketchs=testing_sketchs, split_reconstructions=split_reconstructions, 
    len=len, range=range)

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

又怨 2025-01-16 04:07:58

如果我理解正确，您需要为第一个列表中的每个条目提供一个表格。该表应具有与相应第二列表中的条目相对应的列数，以第一列表中的条目为首。

为此 jinja2 提供了过滤器 < a href="https://jinja.palletsprojects.com/en/3.0.x/templates/#jinja-filters.length" rel="nofollow noreferrer">长度 和循环指数。你的代码看起来像这样。

{% for sketch in testing_sketches %}
<table>
  <thead>
    <th>Image</th>
    {% for i in range(split_reconstructions[loop.index0] | count) %}
    <th>Reconstruction-{{i+1}}</th>
    {% endfor %}
  </thead>
  <body>
    <tr>
      <td>{{ sketch }}</td>
      {% for addr in split_reconstructions[loop.index0] %}
      <td>{{ addr }}</td>
      {% endfor %}
    </tr>
  </tbody>
</table>
{% endfor %}

If I understood you correctly, you want a table for each entry in the first list. This table shall have the number of columns corresponding to the entry in the respective second list, headed by the entry in the first list.

For this jinja2 provides the filter length and loop indices. Your code would look something like this.

{% for sketch in testing_sketches %}
<table>
  <thead>
    <th>Image</th>
    {% for i in range(split_reconstructions[loop.index0] | count) %}
    <th>Reconstruction-{{i+1}}</th>
    {% endfor %}
  </thead>
  <body>
    <tr>
      <td>{{ sketch }}</td>
      {% for addr in split_reconstructions[loop.index0] %}
      <td>{{ addr }}</td>
      {% endfor %}
    </tr>
  </tbody>
</table>
{% endfor %}

回复收藏 0 原文

~没有更多了~