Jinja+Django. Uncaught SyntaxError: Unexpected token ‘{‘

I’m loading js from another file, where i has a line this.data = {{ data.as_list | safe }};.

When it is right in html tag, everything works fine. But when it’s in another file, it throws an error “Uncaught SyntaxError: Unexpected token ‘{‘”. Appreciate any answers.

html

<div class="recipe">
    <div class="recipe-page-pointer" id="recipe-left-page-pointer">
        <svg width="28.5" height="28.5" viewBox="0 0 28.5 28.5">
            <path fill="#FFFFFF" d="M 28.5 0 L 0 14.25 L 28.5 28.5 Z"></path>
        </svg>
    </div>
    <div id="recipe-page-content">
        <span></span>
    </div>
    <div class="recipe-page-pointer" id="recipe-right-page-pointer">
        <svg width="28.5" height="28.5" viewBox="0 0 28.5 28.5">
            <path fill="#FFFFFF" d="M 0 0 L 28.5 14.25 L 0 28.5 Z"></path>
        </svg>
    </div>
    <script src="{% static 'dishes/js/dish-details.js' %}"></script>
</div>

js

constructor() {
    this.data = {{ dish.recipe_as_list | safe }};
    this.scrollbar = document.getElementById('recipe-page-content');

    this.currentPageContent = document.getElementById('recipe-page-content');
    this.currentPageIndex = 0;

    this.leftPointer = document.getElementById('recipe-left-page-pointer');
    this.rightPointer = document.getElementById('recipe-right-page-pointer');

  • Share the full traceback.

    – 

  • It’s full traceback. Error occures right in constructor

    – 

  • Then share the lines around that line in the template.

    – 

  • what are you trying to do here? are you trying to make an object which would store an object with dish.recipe_as_list | safe inside?

    – 

  • converting python list to js list, containing strings

    – 

Leave a Comment