0

I've written my first angular app for handling a rather complex multi-file upload process within a Django app. Everything is working great and I'm loving Angular. However, I stumbled on a simple problem referencing image sources. It's not critical for my app, but I wanted to add a simple spinner/whirligig image while the files are uploading.

In my non-Angular Django templates this is dead simple:

<img src='{% static 'whirligig.gif' %}'>

This doesn't work inside Angular views due to the Angular/Django template syntax conflict. Of course, I can hard-code my Django STATIC_URL path or use a relative path from the Angular partial, but I'd prefer not to. Am I missing something simple here or is this just an unfortunate product of mixing two MVC frameworks?

Fiver
  • 9,909
  • 9
  • 43
  • 63
  • Take a look, might help: http://stackoverflow.com/questions/8302928/angularjs-with-django-conflicting-template-tags – alecxe Mar 22 '14 at 23:03
  • @alecxe, Thanks, I'm starting to think this is messy any which way I cut it. – Fiver Mar 23 '14 at 00:13

1 Answers1

0

Have you tried verbatim tag?

I guess you can do something like:

{% verbatim %}{{ {% endberbatim %}{% static 'whirligig.gif' %}{% verbatim %} }}{% endverbatim %}
James Lin
  • 25,028
  • 36
  • 133
  • 233
  • James, my entire app is wrapped in verbatim in a parent Django base template. I think you are suggesting to escape the verbatim and re-enable the tag but this doesn't work. Can you elaborate? – Fiver Mar 23 '14 at 00:12
  • if your whole app is wrapped in verbatim, you can still place {% endverbatim %} wherever you want django template to generate stuff for you and then place another {% verbatim %} to continue your angular content. – James Lin Mar 23 '14 at 05:13