從本質上講，在瀏覽器加載AngularJS web應用的方式與加載非AngularJS引用的方式一樣。但是，它們的運行方式略有不同。
當你用瀏覽器去訪問index.html的時候，瀏覽器依次做了如下一些事情：
加載html，然后解析成DOM；
加載angular.js腳本；
AngularJS等待DOMContentLoaded事件的觸發；
AngularJS尋找ng-app指令，根據這個指令確定應用程序的邊界；
使用ng-app中指定的模塊配置$injector；
使用$injector創建$compile服務和$rootScope；
使用$compile服務編譯DOM并把它鏈接到$rootScope上；
ng-init指令對scope里面的變量name進行賦值；
對表達式{{name}}進行替換，于是乎，顯示為“Hello World!”
當瀏覽器觸發DOMContentLoaded事件時，AngularJS就開始工作。它首先尋找ng-app指令。[加載AngularJS時，如果document.readyState被設置為complete，AngularJS也會啟動初始化。]
如果瀏覽器在DOM中找到ng-app指令，它會為我們自動啟動應用。如果沒有找到這個指令Angular期望我們自己手動啟動應用。要手動啟動一個AngularJS應用，可以使用Angular的bootstrap()方法。
var ele = document.createElement("div");Angular.bootstrap(ele, ['myApp']);Angular.bootstrap(document, ['myApp']);注意：使用bottstrap()方法只能啟動Angular應用一次。
Angular會使用ng-app指令的值配置injector服務。一旦應用程序加載完成，injector服務。 一旦應用程序加載完成，injector就會在應用程序創建compile服務。compile服務。rootScope創建完成后，compile服務就會接管它。它將compile服務就會接管它。它將rootScope與現有的DOM連接起來，然后從設置ng-app指令為根元素的地方開始編譯DOM。
一、視圖的工作原理：
瀏覽器在提取腳本時（從script標簽中），會暫停DOM解析并等待腳本取回。 當Angular.js被取回時，瀏覽器會執行它，同時設置一個事件監聽器來監聽瀏覽器的DOMContentLoaded事件。
注意：DOMContentLoaded事件會在HTML文檔加載完成并開始解析時觸發。
二、編譯階段：
compile服務會遍歷DOM樹并搜集它找到的所有指令，然后將所有指令的鏈接函數合并為一個單一的鏈接函數。然后這個鏈接函數會將編譯好的模板連接到$rootScope中。
三、運行時
當事件被觸發時，事件處理程序就會在指令（AngularJS）的上下文中進行調用。AngularJS會在包含作用域apply()方法內調用指令。Angular在apply()方法內調用指令。Angular在rootScope上啟動$digest循環時開始整個過程的，并會傳播到所有子作用域中。
Angular進入digest循環時，會等待digest循環時，會等待evalAsync隊列清空，此外digest循環還會等待digest循環還會等待watch沒有東西改變。然后將回調執行上下文交還給瀏覽器，DOM將會被渲染到指令的位置。
AngularJS修改了一般的Javascript工作流，并且提供了它自己的事件處理機制。這樣就把Javascript的context分隔成兩部分，一部分是原生的Javascript的context，另一部分是AngularJS的context。只有處在AngularJS的context中的操作才能享受到Angular的data-binding、exception handling、property watching等服務，但是對于外來者（如原生的Javascript操作、自定義的事件回調、第三方的庫等）Angular也不是一概不接見，可以使用AngularJS提供的$apply()函數將這些外來者包進AngularJS的context中，讓Angular感知到他們產生的變化。
接下來，讓我們一起來看看交互過程中的這幾個循環是怎么工作的？
1. 首先，瀏覽器會一直處于監聽狀態，一旦有事件被觸發，就會被加到一個event queue中，event queue中的事件會一個一個的執行。
2. event queue中的事件如果是被$apply()包起來的話，就會進入到AngularJS的context中，這里的fn()是我們希望在AngularJS的context中執行的函數。
3. AngularJS將執行fn()函數，通常情況下，這個函數會改變應用的某些狀態。
4. 然后AngularJS會進入到由兩個小循環組成的$digest循環中，一個循環是用來處理$evalAsync隊列（用來schedule一些需要在渲染視圖之前處理的操作，通常通過setTimeout(0)實現，速度會比較慢，可能會出現視圖抖動的問題）的，一個循環是處理$watch列表（是一些表達式的集合，一旦有改變發生，那么$watch函數就會被調用）的。$digest循環會一直迭代知道$evalAsync隊列為空并且$watch列表也為空的時候，即model不再有任何變化。
5. 一旦AngularJS的$digest循環結束，整個執行就會離開AngularJS和Javascript的context，緊接著瀏覽器就會把數據改變后的視圖重新渲染出來。