Overriding AngularJS template tags in Django, with previous solution not configured properly

80 views Asked by At

I am trying to override Angular tags of {{ }} based on this answer AngularJS with Django - Conflicting template tags, in my django app, but I am not getting it to recognize the override...in base.htm I have:

{% block main_header %}
<!DOCTYPE html>
<html lang="en">
    <head>

        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Sitename</title>
        <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.css" rel="stylesheet">
        <link href="{% static "screen.css" %}" media="screen, projection" rel="stylesheet" type="text/css" />
        <script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
        <script type="text/javascript">
            scheduleApp.config(function($interpolateProvider){
                $interpolateProvider.startSymbol('[[');
                $interpolateProvider.endSymbol(']]');
            });
            {% block js %}{% endblock %}
        </script>
    </head>
{% endblock %}

In the template I have:

{% extends 'base.htm' %}

{% block body_block %}

<div ng-app="scheduleApp">

    <p>Input something in the input box:</p>
    <p>Name : <input type="text" ng-model="name" placeholder="Enter name here"></p>

    <h1>Hello
            {{ name }} [[ name ]]
    </h1>

</div>

{% endblock %}

I get

enter image description here

I get how it ignores the nonexistent {{ name }}, but why is this override not working? Typing into the input does nothing visible. Thank you

0

There are 0 answers