javascript - 相同的语句在 for 循环内给出错误

Question

Server端使用python配合flask，html模板为jinja2。我正在尝试用 google api 做一个标记。经纬度信息存储在stores[][]中这是从 python 传递的。此代码位于 <script> 之间标记在我的 html 文件中，它工作正常。

var marker = new google.maps.Marker({position: {lat: {{stores[0][5]}}, lng: {{stores[0][6]}}}, map: map});
var marker = new google.maps.Marker({position: {lat: {{stores[4][5]}}, lng: {{stores[4][6]}}}, map: map});

我有多个 lat,lng，我想从中做标记，所以我把它放在 for 中循环。

var i;
for (i = 0; i < 5; i++) { 
  var marker = new google.maps.Marker({position: {lat: {{stores[i][5]}}, lng: {{stores[i][6]}}}, map: map});
}

完全相同的代码，但索引是 i被放置而不是用于索引的数字。它突然给出错误说

jinja2.exceptions.UndefinedError: list object has no element Undefined

我仔细检查了 stores[][]具有超过 5 个元素。这非常非常令人困惑。

Answer 1

你不能这样做。 Jinja 完全在服务器上进行评估，远早于 JS 在客户端上运行。 Jinja 无法从 JS 代码中访问变量。

您应该将循环移至 Jinja 本身。

{% for store in stores %}
   var marker = new google.maps.Marker({position: {lat: {{ store[5] }}, lng: {{ store[6] }}}, map: map});
{% endfor %}