我应该使用哪种方法手动引导我的AngularJS？

Question

我见过以下内容：

angular.bootstrap(document, ['TodoApp']);
angular.bootstrap(angular.element("body")[0], ['TodoApp']);

AngularJS文档也提到了我并不理解的内容。

   angular.element(document).ready(function() {
     angular.bootstrap(document);
   });

这些方法有什么区别吗？特别是Angular文档的最后一个方法是什么？用一个比另一个好吗？

Answer 1

它们大致相同，但存在一些差异：

---

angular.bootstrap(document, ['TodoApp']);

如果您在页面末尾（而不是在标题中）加载了脚本，则此功能将起作用。

否则，在启动应用程序时不会加载DOM（不会有任何模板要编译，指令也没有任何效果）。

这个有效：plnkr

这个不是：plnkr

---

angular.bootstrap(angular.element("body")[0], ['TodoApp']);

与之前相同，使用body作为应用程序的根。它使用了jqLit​​e中没有的选择器，因此您需要在应用程序中包含完整jQuery 。

我不确定使用body代替document有什么好处，但可能与 e2e testing 有关，正如本{{3 }}

comment

---

angular.element(document).ready(function() {
  angular.bootstrap(document);
});

这个实际等待加载DOM ，因此即使您在脚本中包含脚本也能正常工作。

这与jQuery的$(document).ready(基本相同，但使用jqLite的{​​{1}}。

---

在上一个示例中，没有模块传递给引导函数，很可能您需要声明主模块，除非您的应用程序仅包含在全局命名空间中的控制器上。

所以最后一个选项将如下所示，以便与其他两个选项类似：

angular.element

plknr

我猜大多数时候最安全的赌注是使用最后一种方法。