Send data from django views to angularjs controller
<p>I am trying to send data from django views.py file to angularjs controller.js file but unable to send it. 
The problem is this that I am unable to send data from views file to controller. And when I run my code then the value {%steps%} doesn't change to the value I have assigned in views file.
I don't want to use Django rest framework for doing this. 
Is there any other way of achieving this? If yes, then please help me out.</p>

<p><strong>views.py</strong>:</p>

<pre><code>from django.shortcuts import render
from django.conf import settings
from user_data.models import GetData
import json

def home(req):
    return render(req, 'index.html')

def userData(req):
    if req.method == 'GET':
        user_data = GetData().getAllData()
        context_dict = {'user_data1' : json.dumps(user_data[0]),
                        'user_data2' : json.dumps(user_data[1]),
                        'user_steps' : json.dumps(2000)}

        return render(req, 'index.html', context_dict)
</code></pre>

<p><strong>controller.js</strong> :</p>

<pre><code>'use strict';

MetronicApp.controller('DashboardController', function($rootScope, $scope, $http, $timeout) {
    $scope.$on('$viewContentLoaded', function() {   
        // initialize core components
        Metronic.initAjax();
    });
    $scope.steps = {{user_steps|safe}};
});
</code></pre>

<p><strong>html</strong> file:-</p>

<pre><code>&lt;div ng-controller="DashboardController" class="margin-top-10"&gt;
    &lt;div class="row "&gt;
                &lt;div class="col-md-12 col-sm-12"&gt;
                    &lt;div class="portlet light "&gt;
                            &lt;div class="portlet-title"&gt;
                                &lt;div class="caption"&gt;
                                    &lt;i class="icon-cursor font-purple-intense hide"&gt;&lt;/i&gt;
                                    &lt;span class="caption-subject font-purple-intense bold uppercase"&gt;Tracker Report&lt;/span&gt;
                                &lt;/div&gt;
                                &lt;div class="actions"&gt;
                                    &lt;a href="javascript:;" class="btn btn-sm btn-circle btn-default easy-pie-chart-reload"&gt;
                                    &lt;i class="fa fa-repeat"&gt;&lt;/i&gt; Reload &lt;/a&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;
                            &lt;div class="portlet-body"&gt;
                                &lt;div class="row"&gt;
                                &lt;div class="col-md-3"&gt;
                                    &lt;div class="easy-pie-chart"&gt;
                                        &lt;div class="number transactions" data-percent="55"&gt;
                                            &lt;span&gt;{$ steps $}&lt;/span&gt;
                                        &lt;/div&gt;
                                        &lt;!-- &lt;a class="title" href="#"&gt; --&gt;
                                        Steps &lt;!-- &lt;i class="icon-arrow-right"&gt;&lt;/i&gt; --&gt;
                                        &lt;/a&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;
                                &lt;div class="margin-bottom-10 visible-sm"&gt;
                                &lt;/div&gt;
                                &lt;div class="col-md-3"&gt;
                                    &lt;div class="easy-pie-chart"&gt;
                                        &lt;div class="number visits" data-percent="85"&gt;
                                            &lt;span&gt;
                                            +85 &lt;/span&gt;
                                            %
                                        &lt;/div&gt;
                                        &lt;!-- &lt;a class="title" href="#"&gt; --&gt;
                                        Sleep&lt;!-- &lt;i class="icon-arrow-right"&gt;&lt;/i&gt; --&gt;
                                        &lt;/a&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;
                                &lt;div class="margin-bottom-10 visible-sm"&gt;
                                &lt;/div&gt;
                                &lt;div class="col-md-3"&gt;
                                    &lt;div class="easy-pie-chart"&gt;
                                        &lt;div class="number bounce" data-percent="46"&gt;
                                            &lt;span&gt;
                                            +46 &lt;/span&gt;
                                            %
                                        &lt;/div&gt;
                                        &lt;!-- &lt;a class="title" href="#"&gt; --&gt;
                                        Calories &lt;!-- &lt;i class="icon-arrow-right"&gt;&lt;/i&gt; --&gt;
                                        &lt;/a&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;
                                &lt;div class="margin-bottom-10 visible-sm"&gt;
                                &lt;/div&gt;
                                &lt;div class="col-md-3"&gt;
                                    &lt;div class="easy-pie-chart"&gt;
                                        &lt;div class="number bounce" data-percent="32"&gt;
                                            &lt;span&gt;
                                            +32 &lt;/span&gt;
                                            %
                                        &lt;/div&gt;
                                        &lt;/a&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;

                            &lt;/div&gt;
                            &lt;/div&gt;
                        &lt;/div&gt;
                &lt;/div&gt;
&lt;/div&gt;
</code></pre>