title: angular js does not recognize variables in scope
body: <p>I am new to <code>angularjs</code> infact this is the first time I am using <code>angularjs</code> in one of my applications. The application is developed using django. But what I am trying at the moment is not related to django (i guess), I have a very simple template as follows:</p>
  <pre><code>&lt;html xmlns:ng=&quot;http://angularjs.org&quot; lang=&quot;en&quot; ng-app&quot;&gt;&lt;head&gt;
      &lt;title&gt;Testing Angular&lt;/title&gt;
      &lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;/static/css/application.css&quot;&gt;
      &lt;script src=&quot;//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js&quot; »=&quot;&quot; type=&quot;text/javascript&quot;&gt;
      &lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;/static/js/messages.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;http://code.angularjs.org/angular-1.0.0.min.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;/static/js/marketing/app.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;/static/js/marketing/controllers.js&quot;&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id=&quot;content&quot; ng-controller=&quot;UserListControl&quot; class=&quot;ng-scope&quot;&gt;
          [[ users.length ]]
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>and following is the content for <code>app.js</code> and <code>controllers.js</code> respectively.</p>
  <h3>app.js</h3>
  <pre><code>'use strict';
  
  var newApp = angular.module('newApp', []) 
      .config(function($interpolateProvider){
          // To prevent the conflict of `{{` and `}}` symbols
          // between django templating and angular templating we need
          // to use different symbols for angular.
          $interpolateProvider.startSymbol('[[');
          $interpolateProvider.endSymbol(']]');
      });
  </code></pre>
  <h3>controllers.js</h3>
  <pre><code>function UserListControl($scope) {
      $scope.users = [   
          {   
              'name' : 'John Doe',
              'type' : 'Platinum',
          },  
          {   
              'name' : 'Matt Hill',
              'type' : 'Gold',
          }   
      ];  
  }
  </code></pre>
  <p>but the template simply renders <code>[[ users.length ]]</code> instead of actually rendering the length.</p>
  <p>I also tried the <code>ngRepeat</code> directive as follows:</p>
  <pre><code>&lt;p ng-repeat=&quot;user in users&quot;&gt;
      &lt;p&gt;[[user.name]], ([[user.type]])&lt;/p&gt;
  &lt;p&gt;
  </code></pre>
  <p>and</p>
  <pre><code>&lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  </code></pre>
  <p>the first <code>ng-repeat</code> directive renders:</p>
  <pre><code>&lt;!-- ngRepeat: usr in users --&gt;
  &lt;p ng-repeat=&quot;usr in users&quot; class=&quot;ng-scope&quot;&gt;
          &lt;/p&gt;
  &lt;p ng-repeat=&quot;usr in users&quot; class=&quot;ng-scope&quot;&gt;
          &lt;/p&gt;
  &lt;p&gt;&lt;a href=&quot;#&quot;&gt;&lt;/a&gt;()&lt;/p&gt;
  &lt;p&gt;&lt;/p&gt;
  </code></pre>
  <p>and the second one renders:</p>
  <pre><code>&lt;!-- ngRepeat: i in [0, 1, 2, 3, 4, 5, 6, 7] --&gt;
  &lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot; class=&quot;ng-scope&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  &lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot; class=&quot;ng-scope&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  &lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot; class=&quot;ng-scope&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  &lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot; class=&quot;ng-scope&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  &lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot; class=&quot;ng-scope&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  &lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot; class=&quot;ng-scope&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  &lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot; class=&quot;ng-scope&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  &lt;tr ng-repeat=&quot;i in [0, 1, 2, 3, 4, 5, 6, 7]&quot; class=&quot;ng-scope&quot;&gt;&lt;td&gt;[[ i ]]&lt;/td&gt;&lt;/tr&gt;
  </code></pre>
  <p>why is it not able to recognize the variables ? what am i doing wrong ?</p>
  <h3>PS:</h3>
  <p>There are no errors in the console.</p>
  <ul>
  <li>Angular Version: 1.0.0</li>
  <li>Django Version: 1.4</li>
  <li>Web Browser: Google Chrome 24.0.1312.68</li>
  <li>Operating System: Ubuntu 12.04</li>
  </ul>