Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Combining Django Templates and Polymer

I've been stuck for the past few hours trying to figure out why the core Polymer elements are not being displayed properly in a Django application I'm making to act as a personal webpage. The application at the moment just points to an index.html page which, if you follow the tutorial on Polymer, is up to step one.

However, the components are not loading on my page. The static files are all set up correctly, and there's subtle animation from the css files being loaded correctly, but the Roboto font and the core-elements are not being displayed. Running the site as a normal HTML file does everything correctly.

Is there a specific way to user Polymer in a Django template?

Thanks.

like image 706
Andrew McManus Avatar asked Jun 27 '14 10:06

Andrew McManus


People also ask

What does {% %} mean in Django?

{% extends variable %} uses the value of variable . If the variable evaluates to a string, Django will use that string as the name of the parent template. If the variable evaluates to a Template object, Django will use that object as the parent template.

How do I join a Django template?

To configure the Django template system, go to the settings.py file and update the DIRS to the path of the templates folder. Generally, the templates folder is created and kept in the sample directory where manage.py lives. This templates folder contains all the templates you will create in different Django Apps.

Does Django use Jinja2?

The default syntax of Jinja2 matches Django syntax in many ways. However this similarity doesn't mean that you can use a Django template unmodified in Jinja2. For example filter arguments use a function call syntax rather than a colon to separate filter name and arguments.

What is DTL in Django?

Django Template Language (DTL) is the primary way to generate output from a Django application. You can include DTL tags inside any HTML webpage. The basic DTL tag you can include in an HTML webpage is: 1. {% Tag %}


1 Answers

See Eric's answer to this on the polymer-dev mailing list: https://groups.google.com/forum/?fromgroups=#!searchin/polymer-dev/django/polymer-dev/N2R8qknalOI/58ZhC1gWFh4J

Relevant excerpt:

Django 1.5 has support for the verbatim tag. You can wrap your inlined element definitions in that: https://docs.djangoproject.com/en/1.5/ref/templates/builtins/#verbatim

Example code snippet:

{% 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>
like image 60
Michael Avatar answered Oct 18 '22 04:10

Michael