javascript - How to define AngularJS controller in HTML Template -

i have following structure of files:

• index.html

• tpl/page.html

• app.js

description:

1. app.js has definition of main module routing page.html

2. index.html defines view template , includes app.js

3. page.html has definition of pagecontroller inside <script> tag , div using controller.

problem when pagecontroller resides in page.html doesn't work when included app.js works. error following: argument 'pagecontroller' not ananunction, got undefined.

it looks late define controller in template. requirement. want hide page.html + controller (even code) users , make visible particular group spring security. why defined security constraint page , want executed when constraints met.

update #1 controller definition:

<script type="text/javascript">   mainapp.controller('pagecontroller', function($scope, $rootscope) {     ...   }); </script>  <md-content ng-controller="pagecontroller" ... 

if both script tag , html template defined in external html file, angular should complain , cannot have 2 root elements in template file.

my suggestion have controller in separate js file , set spring security permissions on that. if using jsps or similar render main page, add conditional around <script> tag controller if user has access.