访问每个Flask数组元素并使用JavaScript显示为html

我是python和flask的初学者，所以我想问一下如何使用JavaScript访问flask数组、增加其数组索引并以html显示它。我设法只访问它的一个数组并显示它，但我无法增加它的索引以访问它的每个元素。以下是我的代码的一部分：

蟒蛇/烧瓶

@app.route('/Table',methods=['GET', 'POST'])
def showtable():
incr1=0
incr2=0

form = InputForm2(request.form)
session['stemp'] = form.istemp.data
stemp = session['stemp']
session['etemp'] = form.ietemp.data
etemp = session['etemp']
session['stp1'] = form.istp1.data
stp1 = session['stp1']

session['spress'] = form.ispress.data
spress = session['spress']
session['epress'] = form.iepress.data
epress = session['epress']
session['stp2'] = form.istp2.data
stp2 = session['stp2']

incr1 = (etemp - stemp) / stp1
incr2 = (epress - spress) / stp2

tps = np.arange(stemp,etemp,incr1)


for i in range(0,len(tps)):
    tps[i] = tps[i].tolist()

i=0

return render_template('table.html',stemp=stemp,etemp=etemp,incr1=incr1,stp1=stp1,spress=spress,epress=epress,incr2=incr2,
                       tps=tps,i=i)

HTML/JavaScript

因维古尔工具
/*向下移动内容，因为我们有一个50像素高的固定导航栏*/
身体{
填充顶部：50px；
}
/*
*全局附加组件
*/
.副标题{
垫底：10px；
边框底部：1px实心#eee；
}
/*
*顶部导航
*隐藏默认边框以删除1px线。
*/
.导航条固定顶部{
边界：0；
}
/*
*边栏
*/
/*隐藏用于移动，稍后显示*/
.侧边栏{
显示：无；
}
@介质（最小宽度：768px）{
.侧边栏{
位置：固定；
top:51px；
底部：0；
左：0；
z指数：1000；
显示：块；
填充：20px；
溢出x：隐藏；
overflow-y:auto；/*如果视口比内容短，则可滚动内容*/
背景色：#F5；
右边框：1px实心#eee；
}
}
/*侧栏导航*/
.导航侧栏{
右边距：-21px；/*20px填充+1px边框*/
边缘底部：20px；
左边距：-20px；
}
.导航侧栏>li>a{
右边填充：20px；
左侧填充：20px；
}
.nav侧栏>.active>a，
.nav侧栏>.active>a:悬停，
.nav侧栏>.active>a:焦点{
颜色：#fff；
背景色：#428bca；
}
/*
*主要内容
*/
梅因先生{
填充：20px；
}
@介质（最小宽度：768px）{
梅因先生{
右边填充：40px；
左侧填充：40px；
}
}
.主页.页眉{
边际上限：0；
}
/*
*占位符仪表板想法
*/
.占位符{
边缘底部：30px；
文本对齐：居中；
}
.占位符h4{
页边距底部：0；
}
.占位符{
边缘底部：20px；
}
.占位符img{
显示：内联块；
边界半径：50%；
}
/*自定义页脚*/
.页脚{
填充顶部：10px；
边缘顶部：2厘米；
颜色：#777；
边框顶部：1px实心#e5；
}
.出去{
浮动：对；
盒影：0 12像素16像素0 rgba（0,0,0,0.24），0 17像素50像素0 rgba（0,0,0,0.19）；
宽度：180px；
高度：85px；
字体大小：30px；
边界半径：24px；
背景色：柠檬黄；
位置：相对位置；
右：0.5厘米；
边缘顶部：3厘米；
}
.休息{
浮动：对；
盒影：0 12像素16像素0 rgba（0,0,0,0.24），0 17像素50像素0 rgba（0,0,0,0.19）；
宽度：180px；
高度：85px；
字体大小：30px；
边界半径：24px；
背景色：柠檬黄；
边缘顶端：6厘米；
位置：相对位置；
左：4.3厘米；
}
输入[type=“number”]{
左边距：3.7厘米；
}
选择[id=cor4]{
宽度：165px；
}
挑选{
左边距：1厘米；
}
tr：悬停{
背景色：#f5}
切换导航

















基本输入的输出数据
//警报（“{（tps[i]）}”）；
//var xyz='{（tps[0]）}}'；
//var xxx=parseFloat（'{（stemp）}}'）；
var yyy=parseFloat（'{（stp1）}}'）；
//var zzz=parseFloat（'{（incr1）}}'）；
变量i='{（i）}}'；
变量
数据=[
],
container=document.getElementById（'example1'），
hot1；
对于（i；i

仔细看看您编写的javascript代码：

for( i ; i < yyy; i++) {
    //alert(i);
    //alert('{{ (tps[i]) }}'):
    var t = '{{ (tps[i]) }}';
    data.push(
          {temp:t, press:999 } );
     //xyz = '{{ (tps[0 + 1]) }}';
     for(t;t<yyy;t++)
           t = '{{ (tps[i+1]) }}'
  }

然后用javascript迭代数组

---

或者，您可以编写一个返回列表的路由，并在页面上加载该路由的ajax以获取数组。这样，如果数组很大，您的页面将不会永远加载。

请阅读代码，您可以看到我声明为数组的内容，其中的数组是使用numpytanks、JSON.pa从用户输入中获取的值rse真的很有用！很高兴我能提供帮助。如果您在客户端解析json，请确保通过

render_template（…，tps=json.dumps（tps），…）

在控制器中将tps数组转换为json字符串。您可能知道如何将一个wtform中的变量传递给另一个wtform吗？我不确定，抱歉。

var tps_array = JSON.parse('{{ tps | safe }}');