Which method should I use to manually bootstrap my AngularJS? -
i have seen following:
angular.bootstrap(document, ['todoapp']); angular.bootstrap(angular.element("body")[0], ['todoapp']); also angularjs documentation mentions don't understand.
angular.element(document).ready(function() { angular.bootstrap(document); }); is there difference between these methods? in particular last method angular docs doing? 1 better use other?
they same, few differences:
angular.bootstrap(document, ['todoapp']); this work if have scripts loaded at end of page (instead of in header).
otherwise, dom not loaded @ time of bootrsaping app (there won't template compiled, directives won't have effect).
this 1 works: plnkr
this 1 doesn't: plnkr
angular.bootstrap(angular.element("body")[0], ['todoapp']); the same before, using body root of application. uses selector not available in jqlite, need have full jquery included in app.
i'm not sure advantage of using body instead document, has e2e testing, explained in comment
angular.element(document).ready(function() { angular.bootstrap(document); }); this 1 waits dom loaded, work if include scripts in header.
this same jquery's $(document).ready( , using jqlite's angular.element.
in last example, no modules being passed bootstrap function, need declare main module, unless app consists on controllers in global namespace.
so last option following, in order similar other two:
angular.element(document).ready(function() { angular.bootstrap(document, ['todoapp']); }); i guess of time safest bet using last approach.
Comments
Post a Comment