How to output data from controller to Angular js template?

I

Ilya Oskin2016-07-24 12:59:24

Django

Ilya Oskin, 2016-07-24 12:59:24

Hello! I'm trying to make a SPA application on Django + Angular, set up a REST API, and as soon as I got to the public part I came across a problem: Angular refuses to load data from the controller into the template. I simplified the client application to the maximum, but this did not solve the problem:
app.js

var app = angular.module('uniApp', []);
app.controller('uniController', function ($scope) {
  $scope.message = "some text";
});

index.html

<!DOCTYPE html>
<html ng-app="uniApp">
<head>
    <meta charset="utf-8">
    <title>UNI DIGIT</title>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.js"></script>
</head>
<body ng-controller="uniController">
 <h1>{{ message }}</h1>
 {% load staticfiles %}
 <script src="{% static 'js/shared/angular-ui-router.min.js' %}"></script>
 <script type="text/javascript" src="//cdn.jsdelivr.net/restangular/latest/restangular.js"></script>
 <script type="text/javascript" src="{% static 'js/app.js' %}"></script>
</body>
</html>

File structure:

main/
--static/
  --js/
    --app.js    
--templates/
  --main/
    --index.html

When I try to do the same without Django, everything works, maybe that's the point. But Django just gives the html page and the necessary scripts...

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

O

Oleg, 2016-07-24
@Oskin1

The second option, along with the {% verbatim %} tag, is to override the AngularJS tags:

angular.module('app', []).config(function($interpolateProvider){
        $interpolateProvider.startSymbol('{$');
        $interpolateProvider.endSymbol('$}');

After that, instead of the standard {{}}, which conflicts with Django, use {$$}