合并 Python Flask Jinja2 和 Mustache

Question

我将 Mustache.js 与 Flask 和 jinja2 一起使用，但在渲染图像时遇到问题。

由于 {% raw %} 和 {% endraw %}，我成功地在 jinja 中渲染了我的小胡子模板，但现在我需要在我的模板中使用 Jinja 中的 url_for() 来定义我的图像源。来自 mustache 的 {{}} 和来自 Jinja 的 {{}} 之间存在冲突。

我的 javascript :

target = document.getElementById("target");
var template = $('#my-template').html();
Mustache.parse(template);
var rendered = Mustache.render(template, {"title":"My Title","photo_name":"photo.jpg"});
target.innerHTML = rendered;

还有我的模板：

<script id="my-template" type="x-tmpl-mustache">
{% raw %}
  <h1> {{title}} </h1>
  <img src="{{ url_for('static',filename='images/{{photo_name}}') }}" alt="my_photo">
{% endraw %}
</script>

知道如何解决这个问题吗？

Answer 1

您对相当多的内容表示 raw 处理，其中一些内容您真的不想成为原始内容。建议您缩小 {% raw %} ... {% endraw %} 的范围以仅涵盖您希望 Mustache 填写的那些模板变量。例如：

<script id="my-template" type="x-tmpl-mustache">

  <h1> {% raw %}{{title}}{% endraw %} </h1>
  <img src="{{ url_for('static',filename='images/')}}{% raw %}{{photo_name}}{% endraw %}" alt="my_photo">

</script>

对于浏览器，这将呈现以下内容，然后可以通过 JS / Mustache 填充其模板部分：

<script id="my-template" type="x-tmpl-mustache">

  <h1> {{title}} </h1>
  <img src="/static/images/{{photo_name}}" alt="my_photo">

</script>

通过这种方式，您可以让 Mustache 处理特定的模板替换，让 Flask / Jinja2 处理其余部分。

使用两个具有如此交错和重叠职责的模板引擎——更不用说相同的模板变量标记语法——使得 "quoting" 完全必要，但也非常琐碎。

合并 Python Flask Jinja2 和 Mustache

Combine Python Flask Jinja2 and Mustache

python

flask

jinja2

mustache