哪种方法我应该使用手动引导我AngularJS？ [英] Which method should I use to manually bootstrap my AngularJS?

问题描述

我看到以下内容：

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

另外，AngularJS文档中提到这个，我真的不明白。

Also the AngularJS documentation mentions this which I don't really understand.

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

有这些方法有什么区别？特别是取之于角文档的最后一个方法做什么？一个更好比其他使用？

Is there any difference between these methods? In particular what is the last method from the Angular docs doing? Is one any better to use than the other?

推荐答案

他们是大致相同的，有几个不同点：

They are roughly the same, with a few differences:

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

如果您已加载的你的脚本在页面的最后这将工作（而不是在标头）。

This will work if you have your scripts loaded at the end of the page (instead of in the header).

否则，DOM将不会在bootrsaping应用程式时加载的（不会有任何模板进行编译，该指令将不会有任何影响）。

Otherwise, the DOM will not be loaded at the time of bootrsaping the app (there won't be any template to be compiled, the directives won't have any effect).

这一件作品： plnkr

这一个没有： plnkr

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

和以前一样，使用体作为应用程序的根。它使用一个选择，是不是在jqLit​​e，所以你需要有全面的jQuery 包含在应用程序。

The same as before, using body as the root of the application. It uses a selector that is not available in jqLite, so you need to have full jQuery included in the app.

我不知道有什么用体的优势而不是文件，但可能有事可做用的端到端测试的，因为在这种评论

I'm not sure what is the advantage of using body instead document, but probably has something to do with e2e testing, as explained in this comment

plknr

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

这人真正的等待DOM 加载，所以如果您在头脚本，它仍然工作。

This one actually waits for the DOM to be loaded, so it will work even if you include your scripts in the header.

这是基本相同jQuery的 $（文件）。就绪（，但使用 jqLit​​e 的 angular.element 。

This is basically the same as jQuery's $(document).ready( , but using jqLite's angular.element.

在最后一个例子中，没有模块被传递到引导功能，则很可能需要声明你的主模块，除非您的应用程序包括仅在全局命名空间的控制器。

In the last example, no modules are being passed to the bootstrap function, most likely you will need to declare your main module, unless your app consists only on controllers in the global namespace.

所以最后的选择将是像以下，以类似于其它两个

So the last option will be like the following, in order to be similar to the other two:

angular.element(document).ready(function() {
  angular.bootstrap(document, ['TodoApp']);
});

plknr

我想，大部分的时间最安全的赌注使用此最后一种方法。

I guess that most of the time the safest bet is using this last approach.

这篇关于哪种方法我应该使用手动引导我AngularJS？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！