如何在 Jinja2 中使用 JavaScript 变量，例如访问列表条目？答案

【问题标题】：How to use JavaScript variables in Jinja2, e.g. for accessing a list entry?如何在 Jinja2 中使用 JavaScript 变量，例如访问列表条目？
【发布时间】：2021-05-18 14:42:39
【问题描述】：

是否有可能使用 Jinja2 实现以下功能？

在我的<script>：

    function get_word() {
        let entry_number = 0;
        let g = "{{ words[" + entry_number + "] }}"; 
}

我有一个单词列表。我想访问该列表的 entry_numberth 键。 entry_number 是一个 js 变量。我尝试实现这一目标的方式不起作用 jinja2.exceptions.UndefinedError: list object has no element entry_number。所以它不使用entry_number 的值，而是查找显然不存在的entry_number 条目。

【问题讨论】：

标签： javascript html jinja2

【解决方案1】：

Jinja 将在服务器上呈现。 js会在客户端执行。
这个"{{ words[" + entry_number + "] }}"; 不是神社变量。所以 Jinja 不会解析它。

但是您可以将单词列表（作为 jinja 变量）传递给客户端并在您的 js 代码中使用它。

内联脚本示例：

<script>
  const words = {{ words | tojson }};
  ...
  function get_word() {
    let entry_number = 0;
    let g = words[entry_number];
    ...
  }
  ... 
</script>

【讨论】：