如何将数据从 Flask 传递到 Google Maps API 模板中的 JavaScript？

将数据从 Flask 传递到模板中的 JavaScript

概述

Flask 应用程序需要将信息从 Python 字典传递到模板中的 JavaScript，特别是用于 Google Maps API。

解决方案

Flask 中的 Render_template 提供了一种将变量传递到模板以进行 HTML 渲染的机制。要将此功能扩展到 JavaScript，您可以利用 Jinja 模板引擎。具体方法如下：

1. 在任何地方合并变量： Jinja 变量可以在整个模板中使用，包括 JavaScript 部分。
2. 直接赋值： 使用 {{variable}} 直接分配 JavaScript 变量。例如，您可以将经度分配给 JavaScript 变量：

<code class="javascript"><script>
  var longitude = '{{ geocode[1] }}';
</script></code>

3. 生成数组定义： 如果要将数组传递给 JavaScript，请生成它作为模板中的数组定义：

<code class="html">  <script>
    var geocode = ['{{ geocode[0] }}', '{{ geocode[1] }}'];
  </script></code>

4. 利用 Jinja 构造： Jinja 提供更高级的构造。例如，您可以使用 join 过滤器来缩短数组定义：

<code class="html"><script>
  var geocode = [{{ ', '.join(geocode) }}];
</script></code>

5. 考虑 tojson 过滤器： 对于更复杂的数据结构，请使用 tojson 过滤器将字典和列表转换为 JSON 字符串以供 JavaScript 使用：

<code class="html">  <script>
    var geocode = {{ geocode | tojson }};
  </script></code>

以上是如何将数据从 Flask 传递到 Google Maps API 模板中的 JavaScript？的详细内容。更多信息请关注PHP中文网其他相关文章！