4

this is home.html

<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>SPM</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" type="text/css" href="../css/bootstrap/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="../css/common/common.css" />
<link rel="stylesheet" type="text/css" href="../js/treeview/css/angular.treeview.css">
<script src="../js/jquery/jquery-2.1.1.min.js"></script>
<script src="../js/bootstrap/bootstrap.js"></script>

<script type="text/javascript" src="../js/angular/angular.min.js"></script>
<script type="text/javascript" src="../js/treeview/angular.treeview.min.js"></script>




<script type="text/javascript" src="../js/AJcontrollers/spmControllers.js"></script>


<script type='text/javascript'>//<![CDATA[ 
  //angular module
  
 'use strict';
 alert("1");
 var myApp = angular.module('myApp', ['angularTreeview','ngLoadScript']);
 
 myApp.controller('commonController', ['$scope', '$http',  function($scope, $http) {
  $scope.menus =  [
               { link : '/summary', treeState : '' , url: 'body.html'},
               { link : '/indicator', treeState : '' , url: 'manageHierarchy.html'}
              
            ];
  
  $scope.menu = $scope.menus[0];
  
 
 }]);


</script>
</head>



<body  ng-controller="commonController">

 <div>
  <div ng-include="'head.html'"></div>
 </div>
 
 
 <!-- footer  -->
 <footer class="footer">
  <div ng-include="'footer.html'"></div>
 </footer>
 <!-- footer  -->

</body>

</html>

and

head.html is

<script type='text/javascript'>

myApp.controller('headController', ['$scope', '$http',  function($scope, $http) {
 
 $scope.change = function (param){
  alert(param);
  
 };
}]);

</script>



<div ng-controller="headController">
    details......
</div>

use angularjs version 1.3.7

problem is 'can't find headController'

in my code what shoud i do ? can i change my angular version? 1.2.X version can allow function headController($scope){ .....}; but 1.3.7 not work what can i do ?

Cha winter
  • 41
  • 3
  • you should check http://stackoverflow.com/questions/12197880/angularjs-how-to-make-angular-load-script-inside-ng-include – bahadir Dec 25 '14 at 16:28

1 Answers1

0

This is a know issue that has been reported.

https://github.com/angular/angular.js/issues/3756

https://gist.github.com/endorama/7369006

Long story short, the script tag is a special little flower and angular does not treat it as such. If you include jquery before you include angular this issue will resolve itself. Otherwise you can do the script lazy loading technique that the github links recommend.

Or just move the script tag from head.html and put it on home.html since it will always be needed. (Disclaimer: I would not do this for an app of any size and complexity, but for something small it is the easiest solution. Of course creating js files and including them via seperate scripts would be best.)

DavidEdwards
  • 593
  • 3
  • 12
  • 2
    thank you , I solved this problem ....using this code App.config(function ($controllerProvider) { App.controller = $controllerProvider.register; }); – Cha winter Feb 05 '15 at 02:31
  • @Chawinter thanks! your comment helped me to get it to work.. you should add it as an answer and then mark it as the "Accepted answer" so that somebody doesn't miss this gem. – supersan May 09 '15 at 18:38
  • two hours...two freaking hours. Thanks, your comment helped @Cha winter – Senica Gonzalez May 21 '15 at 23:31