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

时间:2013-05-14 07:51:39

标签: angularjs

我见过以下内容:

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

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

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

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

1 个答案:

答案 0 :(得分:63)

它们大致相同,但存在一些差异:


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

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