title: How to define AngularJS controller in HTML Template
body: <p>I have the following structure of files:</p>
  
  <ul>
  <li><p>index.html</p></li>
  <li><p>tpl/page.html</p></li>
  <li><p>app.js</p></li>
  </ul>
  
  <p>Description:</p>
  
  <ol>
  <li><p>app.js has definition of main module with routing to page.html</p></li>
  <li><p>index.html defines view for template and includes app.js</p></li>
  <li><p>page.html has definition of PageController inside <code>&lt;script&gt;</code> tag and div who is using this controller.</p></li>
  </ol>
  
  <p><strong>Problem</strong>
  When PageController resides in page.html it doesn't work but when it is included into app.js then it works. Error is following: Argument 'PageController' is not aNaNunction, got undefined.</p>
  
  <p>It looks like it is too late to define controller in template. But actually it is my requirement. I want to hide page.html + controller (even their code) from all users and make it visible only to particular group by Spring security. That is why I defined security constraint for this page and want it to be executed only when this constraints are met.</p>
  
  <p><strong>Update #1</strong> Controller definition:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    mainApp.controller('PageController', function($scope, $rootScope) {
      ...
    });
  &lt;/script&gt;
  
  &lt;md-content ng-controller="PageController" ...
  </code></pre>