Question

我正在研究烧瓶+ jinja2网站，该网站涉及在地图上绘制一些存储的标记。

Python代码

resultroute['checkpointlist'] = CheckPoint.query.filter_by(route_id=route.code)
return render_template('routes/edit.html',route=resultroute)

edit.html中的Javascript

    function addExistingMarkers() {
        //Individual access to elements
        var name0 = '{{route.checkpointlist[0].name}}';
        var lat0 = {{route.checkpointlist[0].latitude}};
        var long0 = {{route.checkpointlist[0].longitude}};
        var marker = new google.maps.Marker({
          position: new google.maps.LatLng({{ route.checkpointlist[0].latitude }}, {{ route.checkpointlist[0].longitude }}),
          map: map,
          title: '{{ route.checkpointlist[0].name }}'
        });

        //Trying to iterate over the list
        {% for checkpoint in route.checkpointlist %}
            var lat = checkpoint.latitude;
            var long = checkpoint.longitude;
            var cpname = checkpoint.name;
            var location = new google.maps.LatLng(lat, long);

            var marker = new google.maps.Marker({
                  map: map,
                  draggable:true,
                  title:cpname,
                  animation: google.maps.Animation.DROP,
                  position: location,
            });
         {% end for %}
    }

只有一个标记来自[0]元素的单独访问。但不知何故，for循环不起作用。

Answer 1

您的技巧帮助我构建了JS函数，
但我想进行调整，
您需要使用{% endfor %}而不是{% end for %}。

Answer 2

{% for checkpoint in route.checkpointlist %}
  var lat = {{checkpoint.latitude}};
  var long = {{checkpoint.longitude}};
  var cpname = {{checkpoint.name}};
  var location = new google.maps.LatLng(lat, long);

  var marker = new google.maps.Marker({
    map: map,
    draggable: true,
    title: cpname,
    animation: google.maps.Animation.DROP,
    position: location,
  });
 {% end for %}

在Jinja模板中引用变量时，您需要包含双括号。

Jinja2 for循环javascript列表不工作但访问单个元素工作

2 个答案: