Я видел следующее:
angular.bootstrap(document, ['TodoApp']);
angular.bootstrap(angular.element("body")[0], ['TodoApp']);
Также в документации AngularJS упоминается это, что я действительно не понимаю.
angular.element(document).ready(function() {
angular.bootstrap(document);
});
Есть ли разница между этими методами? В частности, каков последний метод из документов Angular? Можно ли лучше использовать другой?
Они примерно одинаковы, с несколькими отличиями:
angular.bootstrap(document, ['TodoApp']);
Это будет работать, если ваши сценарии загружены в конце страницы (а не в заголовке).
В противном случае DOM не будет загружаться во время загрузки приложения (не будет никакого шаблона, который будет скомпилирован, директивы не будут иметь никакого эффекта).
Это работает: plnkr
В этом нет: plnkr
angular.bootstrap(angular.element("body")[0], ['TodoApp']);
То же, что и раньше, используя body в качестве корня приложения. Он использует селектор, который недоступен в jqLite, поэтому вам нужно иметь полный jQuery, включенный в приложение.
Я не уверен, в чем преимущество использования body вместо document, но, вероятно, имеет какое-то отношение к тестированию e2e, как объяснено в этом комментарии
angular.element(document).ready(function() {
angular.bootstrap(document);
});
На самом деле ожидает, что DOM будет загружен, поэтому он будет работать, даже если вы включите свои скрипты в заголовок.
Это в основном то же самое, что и jQuery $(document).ready(, но с помощью jqLite angular.element.
В последнем примере, никакие модули не передаются в функцию начальной загрузки, скорее всего, вам нужно будет объявить ваш основной модуль, если ваше приложение не состоит только из контроллеров в глобальном пространстве имен.
Итак, последний вариант будет похож на следующий, чтобы быть похожим на два других:
angular.element(document).ready(function() {
angular.bootstrap(document, ['TodoApp']);
});
Я предполагаю, что большую часть времени самая безопасная ставка использует этот последний подход.