[Answered ]-Django not detecting AngularJS

by

2👍

✅

Let’s see…

  1. In header.html you seem to have no {% block content %} defined. There is nothing your template can inherit if no defined.

  2. in home.html you have an additional html wrapping. You don’t need it. In fact AFAIK the extends tag should be the first content in the file, aside from imports.

  3. If you intend to add angular bindings like {{ this }}, ensure you wrap the bindable content in {% verbatim %} tags since the same syntax is used for django templates rendering.

Said this, I’d fix your templates like this:

Header:

{% load staticfiles %}
{# PLEASE add template tags imports at the beginning of the file #}
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
    <!-- PLEASE ACCURATELY INDENT YOUR CODE!!!! -->
    <!-- I hope you have myApp defined in js/script.js file -->
    <head>
        <title>This is my title</title>
        <meta charset="UTF-8" />
        <link rel="stylesheet" href="{% static 'css/style.css' %}" type="text/css"/>
        <link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
        <script data-require="angular.js@*" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
        <script src="{% static 'js/script.js' %}"></script>
    <!-- PLEASE FOR GOD\'S SAKE MAKE A COMPLIANT HTML FILE!!!!!! I DONT KNOW WHAT IS THE REMAINING FILE BODY BUT I WILL ADD IT RIGHT NOW IN A MINIMALIST WAY -->
    </head>
    <body>
        {% block content %}{% endblcok %}
    </body>
</html>

The home file will be: 

{% extends "query/header.html" %}
{% block content %}
    <p>Hey what's up</p>
    <select name="dropDown" ng-model="data.dropDown">
    {% for num in list %}
        <option value="num">{{ num }}</option>
    {% endfor %}
</select>
{% verbatim %}
<p>You chose: {{ data.dropDown }}</p>
{% endverbatim %}
👤Luis Masuelli

Leave a comment