【angularJS】启动（bootstrap）机制
Angular的启动分为手动和自动两种。
自动启动
定义模块的例子中，采用的就是自动的方式：通过内置的指令ngApp 来指定启动时加载的模块。<html ng-app="myApp">
根据官方文档，Angular的自动初始化发生在两个时机：
1、响应DOMContentLoaded事件（页面文档完全加载并解析完毕后会触发该事件，不会等待图片、样式文件）
2、document.readyState的值为'complete'。（兼容IE8，页面完全加载，相当于load事件触发）
这时，Angular会调用angularInit方法进行初始化，首先查找ngApp directive，该directive指定了应用程序的根结点，通常位于初始页面的<html>标记上。当然，ngApp如果位于某个子结点（如div元素），则可以将Angular应用程序限制在DOM树的一部分上。如果Angular找到了ngApp，则会调用bootstrap方法开始启动过程，主要工作如下：
- 加载ngApp指定的模块
- 创建应用程序的依赖注入对象（injector）。此时$compile，$rootScope会被注入，用于后续的compile过程。有关依赖注入过程有后文。
- 以ngApp为根结点，compile整个DOM树。有关compile过程，在后续文章中详谈。
手动启动
有些情况下，开发者需要在初始化阶段做些额外的配置或控制，比如include一些模块或者需要在compile过程之前完成一些工作。这就需要手动启动。手动启动通过angular.bootstrap方法。一个例子如下：
<script>
angular.module('myApp', [])
.controller('MyController', ['$scope', function ($scope) {
}]);
angular.element(document).ready(function() {
angular.bootstrap(document, ['myApp']);
});
</script>
该方法的第一个参数指定了Angular应用所在的根DOM元素；
第二个参数定义了需要依赖加载的模块（相当于ngApp），该模块必须事先定义完成（包括其controller，directive等组件），bootstrap方法不会定义该模块。
（该方法还有第三个参数，参见这里）。一个Anuglar应用一旦启动，就不能再添加controller, service等组件。
值得注意的是：
- angular.bootstrap只会绑定第一次加载的对象。
- 后面重复的绑定或者其他对象的绑定，都会在控制台输出错误提示。
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· 10年+ .NET Coder 心语 ── 封装的思维：从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源！
· 周边上新：园子的第一款马克杯温暖上架