AngularJs原理

要想很好的把握AngularJs，首先要了解AngularJs的运行机制，它的原理，清楚的知道它每一步都做了什么。

启动

1.浏览器加载html，然后解析成DOM；

DOM（Document Object Model，文档对象模型）可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。DOM是以面向对象方式描述的文档模型，定义了表示和修改文档所需要的对象，这些对象的行为和属性以及这些对象之间的关系，定义了访问和操作文档的标准方法。可以把DOM认为是页面上数据和结构的一个树形表示。

2.浏览器加载angular.js脚本；

3.AngularJS等到DOMContentLoaded事件触发；

页面文档完全加载并解析完毕之后,会触发DOMContentLoaded事件，当DOMContentLoaded事件触发，在DOM加载完之后。

4.AngularJs寻找ng-app指令，确定AngularJs管理的边界；

一般ng-app写在标签里，指定AngularJs管理整个页面上所有的DOM元素，也可以写在其他的标签里，这样的话就管理其中一部分。

5.使用ng-app中指定的模块来配置注入器（$injector）；

每个AngularJs应用都有一个注入器（$injector）用来处理依赖的创建，注入器是一个负责查找和创建依赖的服务定位器。

6.使用注入器来创建编译服务（$compile service）和根作用域（$rootScope）；

7.编译服务编译DOM并把它连接到根作用域；

8.渲染页面。

执行期

AngularJs和浏览器的事件回路交互。

1.浏览器的事件循环等待事件的触发，所谓事件包括用户的交互操作，定时事件或网络事件；

2.事件触发后，回调被执行，进入javaScript，通常回调会修改DOM；

3.回调执行完毕，浏览器会根据DOM重新渲染页面。