Angular JS bootstrapping app
Question
Hi I have a problem with bootstrapping Angular JS.
This is my HTML doc in django templating
<html>
...
<body>
.... at the end ....
<script src="//cdnjs.cloudflare.com/ajax/libs/json2/20121008/json2.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
<script type="text/javascript" src="{% static 'js/ui/transition.js' %}"></script>
<script type="text/javascript" src="{% static 'js/ui/collapse.js' %}"></script>
<script type="text/javascript" src="{% static 'js/ui/accordion.js' %}"></script>
<script type="text/javascript" src="{% static 'js/ui/tabs.js' %}"></script>
<script type="text/javascript" src="{% static 'js/ui/dialog.js' %}"></script>
<script type="text/javascript" src="{% static 'js/ui/modal.js' %}"></script>
<script type="text/javascript" src="{% static 'js/ui/alert.js' %}"></script>
<script type="text/javascript" src="{% static 'js/ui/validated.js' %}"></script>
<script type="text/javascript" src="{% static 'js/ui/fb.js' %}"></script>
<script type="text/javascript" src="{% static 'js/app/base.js' %}"></script>
<script>
angular.element(document).ready(function() {
try{ angular.bootstrap(document, ['app.base']);
}catch(e){alert(e)}
});
</script>
(I know there are many UI scripts... but that's not the point)
Edited i think the problem is that I am running django's dev server which doesn't handle concurrent requests quite well. Apparently, it would sometimes drop connections, thereby causing the browser not to load files (random). This problem has been observed in Chrome as well as other browsers.
1 answers
solution1
1 2013-05-06 17:44:15
Generally speaking, when Angular throws a "no module" error, it means that there is an error in that module. It has nothing to do with the order they're loaded. I'd run a jsLint on the file and see if it compiles.
Do you need to bootstrap manually? If you're only loading one app you can attach an ng-app directive to any HTML element. I'm not sure you can use the try-catch like that with bootstrapping. What I do is something like this:
$.when(angular.bootstrap(document.getElementById('my-div'), ['my-app']))
.done(function() {
console.log("my-app has been bootstrapped to my-div");
});
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.