For an experiment I wanted to inline my Javascript files and I've come across some unexpected behavior.
Everything works fine with a normal Angular import like this:
<html>
<head>
<script src="/js/angular.js"></script> <!-- Works fine! -->
<script>
var app = angular.module('example', []);
</script>
...
</head>
...
</html>
However, It raises an exception if I inline the Angular source code like this:
<html>
<head>
<script>// Minified Angular source code </script>
<script>
var app = angular.module('example', []);
</script>
...
</head>
...
</html>
The exception:
Uncaught ReferenceError: a is not defined
Happens to me with yeoman + grunt. Make sure you have your controllers setup like this before minification:
angular.module('project').controller('MainCtrl', [
'$scope',
function ($scope) { }
]);
And not like this:
angular.module('project').controller('MainCtrl',
function ($scope) { }
);
If i remember correctly, its a "bug" of sorts with the way angular injects dependencies
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.