python - 如何将for循环输出(列表)传递给html页面
问题描述
在 SO 专家的帮助下,我能够将单个 for 循环数据(列表)传递给 html 页面。现在我有 2 个 for 循环(节点列表和链接列表),每个循环都有自己的列表。然后将节点和链接合并到一个列表中。因此,如何将内容节点和链接数据的列表发送到 html 页面...请指教。
这是代码
## 2 for loop to extract list of nodes and links
@app.route('/')
def mypage():
def topo():
resData = json.load(open('odl_topo.txt'))
topology = resData['network-topology']['topology'][0]
nodes = []
for node in topology['node']: #1st loop to get list of nodes
<some code here>
return nodes
links = []
for link in topology['link']: #2nd loop to get list of links
<some code here>
return links
nodeslinks_topo = {'nodes': nodes, 'links': links}
final_topo = json.dumps(nodeslinks_topo)
final_topo = topo()
#nodes = topo()
#links = topo()
## Able to send to html page either nodes or links but not both nodes and
## links data
##this work only if send to html list of nodes data
#return render_template('myweb.html', mytopo=nodes)
##this work only if send to html list of links data
#return render_template('myweb.html', mytopo=links)
##I want to send list of nodes and links together to html and this doesn't
work
return render_template('myweb.html', mytopo=nodeslinks_topo)
#Flask web server
if __name__ == "__main__":
app.run(host='0.0.0.0',debug = True)
网页
<html>
<body>
<h1>Topology</h1>
<table id="yourTableID" width="100%" cellspacing="5">
<thead>
<tr>
<th> Nodes </th>
<th> Links </th>
</tr>
</thead>
<tbody>
{% for i in mytopo %}
<tr>
<td>
{{ i["id"] }}
</td>
<td>
{{ i["source"] }}
</td>
<td>
{{ i["target"] }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</body>
</html>
jsonfile 节点和链接的内容列表
{
"nodes": [
{
"id": "openflow:1",
"tpid": [
"openflow:1:2",
"openflow:1:1",
"openflow:1:LOCAL"
]
},
{
"ip": "10.0.0.1",
"mac": "00:00:00:00:00:01",
"id": "host:00:00:00:00:00:01",
"tpid": [
"host:00:00:00:00:00:01"
]
},
{
"id": "openflow:2",
"tpid": [
"openflow:2:LOCAL",
"openflow:2:1",
"openflow:2:2"
]
},
{
"ip": "10.0.0.2",
"mac": "00:00:00:00:00:02",
"id": "host:00:00:00:00:00:02",
"tpid": [
"host:00:00:00:00:00:02"
]
}
],
"links": [
{
"source": "host:00:00:00:00:00:01",
"id": "host:00:00:00:00:00:01/openflow:1:1",
"target": "openflow:1:1"
},
{
"source": "openflow:2:1",
"id": "openflow:2:1/host:00:00:00:00:00:02",
"target": "host:00:00:00:00:00:02"
},
{
"source": "openflow:1:2",
"id": "openflow:1:2",
"target": "openflow:2:2"
},
{
"source": "openflow:2:2",
"id": "openflow:2:2",
"target": "openflow:1:2"
},
{
"source": "openflow:1:1",
"id": "openflow:1:1/host:00:00:00:00:00:01",
"target": "host:00:00:00:00:00:01"
},
{
"source": "host:00:00:00:00:00:02",
"id": "host:00:00:00:00:00:02/openflow:2:1",
"target": "openflow:2:1"
}
]
}
我在看页面会呈现这样的东西
Topology
Nodes Link
openflow:1 host:00:00:00:00:00:01 - openflow:1:1
10.0.0.1 openflow:2:1 - host:00:00:00:00:00:02
openflow:2 openflow:1:2 - openflow:1:2
10.0.0.2 openflow:2:2 - openflow:1:2
openflow:1:1 - host:00:00:00:00:00:01
host:00:00:00:00:00:02 - openflow:2:1
Really appreciate for your help and support on this matter.
Thank you
解决方案
您的问题在您的 for 循环中。您正在尝试从此处的列表中提取项目
{% for i in mytopo %}
<tr>
<td>{{ i["id"] }}</td>
<td>{{ i["source"] }}</td>
<td>{{ i["target"] }}</td>
</tr>
{% endfor %}
如果您的 json 对象看起来像这样,您可以使用它
[{'id': 'fizz', 'source': 'buzz', 'target': 'fizzbuzz'},
{'id': 'batman', 'source': 'testing', 'target': 'hello'}]
推荐阅读
- python - 通过列中的标签列表对熊猫数据框行进行分组的有效方法
- reactjs - 如何在 ReactJs 中更改状态时添加段落
- java - 如何从 Java 1.8.0 升级到 Java 11?
- api - 将组添加到 Auth Code Flow pt 的范围。1
- python - 用文本小部件编写的行间距
- python - 如何在 pandas pd.read_excel 中通过其索引而不是其名称来指定列 dtype
- angular - 将 Keycloak 与 Angular 集成
- json - 如何在ansible中将字典或列表转换为字符串
- github - 如何让dependabot仅触发安全更新
- javascript - 为可以将文件夹归档为 ZIP 以供下载的 ftp 文件服务器创建 Web UI