结合 Django 模板和 Polymer答案

【问题标题】：Combining Django Templates and Polymer结合 Django 模板和 Polymer
【发布时间】：2014-06-27 10:07:00
【问题描述】：

在过去的几个小时里，我一直在试图弄清楚为什么核心 Polymer 元素没有在我制作的 Django 应用程序中正确显示以充当个人网页。目前的application 只指向一个index.html 页面，如果您在Polymer 上关注tutorial，则可以进入第一步。

但是，组件没有加载到我的页面上。静态文件都设置正确，正确加载的 css 文件有细微的动画，但没有显示 Roboto 字体和核心元素。将站点作为普通 HTML 文件运行，一切正常。

在 Django 模板中使用 Polymer 是否有特定的方法？

谢谢。

【问题讨论】：

标签： django django-templates polymer

【解决方案1】：

在聚合物开发邮件列表中查看 Eric 对此的回答：https://groups.google.com/forum/?fromgroups=#!searchin/polymer-dev/django/polymer-dev/N2R8qknalOI/58ZhC1gWFh4J

相关摘录：

Django 1.5 支持逐字标记。您可以将内联元素定义包装在： https://docs.djangoproject.com/en/1.5/ref/templates/builtins/#verbatim

示例代码 sn-p：

{% verbatim %}
<template repeat="{{item as items}}">
  <my-element name="{{item.name}}"></my-element>
</template>
{% endverbatim %}

<script>
  document.querySelector("template').model = {{items}}; // items here is filled by the server's template.
</script>

【讨论】：

这行得通。还有助于为页面正确设置 CSS。我完全错了，但很高兴确认需要逐字逐句。

【解决方案2】：

我很确定这与 Django 在其模板中使用与 Polymer 相同的 {{}} 这一事实有关。

【讨论】：

您可能必须单独提供组件，这样 Django 就不会替换所有 Polymer 元素的{{}}。这就是this 似乎推荐的。
我不了解 Django，但也可能有一种方法可以告诉 Django 不要解析您的components 目录中的任何.html 文件。
我过去使用include_raw 标签解决了这个问题。这告诉 Django 不要解释那段代码github.com/GoogleChrome/chromium-dashboard/blob/master/…
这似乎是模板加载器渲染'{{}}'使元素失败。但是，尝试手动将 '{% verbatim %}' 标签包裹在聚合物调用的文件中的 '{{ }}' 实例周围不会正确显示内容。元素调用其他包含更多“{{}}”的html文件也很不方便。 @ebdel - 从静态内容调用文件时如何实现此模板标签？看起来不错，但不确定如何使用此标签。
如果文件是真正的静态文件，它们不会被 djnago 的模板引擎处理。应该不是问题。也许我误解了你的设置。

【解决方案3】：

我将此答案添加为对已接受答案的补充。

您可以强制 django 为其模板标签要求一个空格。因此，对于任何 django 模板标签，您必须使用 {{ variable }}，对于聚合物，您将使用 {{variable}}。

这是我创建的一个非常简单的模块/应用程序，用于“准备”django 以与聚合物一起使用。

https://github.com/andrewebdev/django-ostinato/blob/2c435dea23319be6e9011e7381afca2b4092b5a2/ostinato/polyprep/init.py

此建议归功于 https://github.com/nebrybledu。

【讨论】：