由于編輯器太難用本冲，無法粘貼復(fù)制代碼、格式不習(xí)慣。轉(zhuǎn)到博客http://blog.sina.com.cn/fengbing8
我們現(xiàn)在開始準(zhǔn)備編寫AngularJS應(yīng)用——phonecat雀鹃。這一步驟（步驟0），您將會(huì)熟悉重要的源代碼文件励两，學(xué)習(xí)啟動(dòng)包含AngularJS種子項(xiàng)目的開發(fā)環(huán)境黎茎，并在瀏覽器端運(yùn)行應(yīng)用。
進(jìn)入angular-phonecat目錄当悔，運(yùn)行如下命令：
npm start
來啟動(dòng)服務(wù)器傅瞻，啟動(dòng)后命令行終端將會(huì)提示Http Server running at http://localhost:8000,請(qǐng)不要關(guān)閉該終端踢代，關(guān)閉該終端即關(guān)閉了服務(wù)器。在瀏覽器中輸入http://localhost:8000/app/index.html來訪問我們的phonecat應(yīng)用嗅骄。
現(xiàn)在胳挎，在瀏覽器中您應(yīng)該已經(jīng)看到了我們的初始應(yīng)用，很簡單掸读，但說明我們的項(xiàng)目已經(jīng)可以運(yùn)行了串远。
應(yīng)用中顯示的“Nothing here yet!”是由如下HTML代碼構(gòu)建而成，代碼中包含了AngularJS的關(guān)鍵元素儿惫，正是我們需要學(xué)習(xí)的澡罚。
app/index.html
代碼在做什么呢？
ng-app指令：
<html lang="">
ng-app指令標(biāo)記了AngularJS腳本的作用域肾请，在中添加ng-app屬性即說明整個(gè)都是AngularJS腳本作用域留搔。開發(fā)者也可以在局部使用ng-app指令，如
铛铁，則AngularJS腳本僅在該
中運(yùn)行隔显。
AngularJS腳本標(biāo)簽：
這行代碼載入angular.js腳本哪替，當(dāng)瀏覽器將整個(gè)HTML頁面載入完畢后將會(huì)執(zhí)行該angular.js腳本邑遏，angular.js腳本運(yùn)行后將會(huì)尋找含有ng-app指令的HTML標(biāo)簽，該標(biāo)簽即定義了AngularJS應(yīng)用的作用域概而。
雙大括號(hào)綁定的表達(dá)式：
Nothing here {{'yet' + '!'}}
這行代碼演示了AngularJS模板的核心功能——綁定倍权，這個(gè)綁定由雙大括號(hào){{}}和表達(dá)式'yet' + '!'組成掷豺。
這個(gè)綁定告訴AngularJS需要運(yùn)算其中的表達(dá)式并將結(jié)果插入DOM中，接下來的步驟我們將看到薄声，DOM可以隨著表達(dá)式運(yùn)算結(jié)果的改變而實(shí)時(shí)更新当船。
AngularJS表達(dá)式Angular expression是一種類似于JavaScript的代碼片段，AngularJS表達(dá)式僅在AngularJS的作用域中運(yùn)行默辨，而不是在整個(gè)DOM中運(yùn)行德频。
引導(dǎo)AngularJS應(yīng)用
通過ngApp指令來自動(dòng)引導(dǎo)AngularJS應(yīng)用是一種簡潔的方式，適合大多數(shù)情況缩幸。在高級(jí)開發(fā)中壹置，例如使用腳本裝載應(yīng)用，您也可以使用bootstrap手動(dòng)引導(dǎo)AngularJS應(yīng)用表谊。
AngularJS應(yīng)用引導(dǎo)過程有3個(gè)重要點(diǎn)：
注入器(injector)將用于創(chuàng)建此應(yīng)用程序的依賴注入(dependency injection)蒸绩；
注入器將會(huì)創(chuàng)建根作用域作為我們應(yīng)用模型的范圍；
AngularJS將會(huì)鏈接根作用域中的DOM铃肯，從用ngApp標(biāo)記的HTML標(biāo)簽開始，逐步處理DOM中指令和綁定传蹈。
一旦AngularJS應(yīng)用引導(dǎo)完畢押逼，它將繼續(xù)偵聽瀏覽器的HTML觸發(fā)事件步藕，如鼠標(biāo)點(diǎn)擊事件、按鍵事件挑格、HTTP傳入響應(yīng)等改變DOM模型的事件咙冗。這類事件一旦發(fā)生，AngularJS將會(huì)自動(dòng)檢測變化漂彤，并作出相應(yīng)的處理及更新雾消。
上面這個(gè)應(yīng)用的結(jié)構(gòu)非常簡單。該模板包僅含一個(gè)指令和一個(gè)靜態(tài)綁定挫望，其中的模型也是空的立润。下一步我們嘗試稍復(fù)雜的應(yīng)用！
我工作目錄中這些文件是干什么的媳板？
上面的應(yīng)用來自于AngularJS種子項(xiàng)目桑腮，我們通常可以使用AngularJS種子項(xiàng)目來創(chuàng)建新項(xiàng)目蛉幸。種子項(xiàng)目包括最新的AngularJS代碼庫破讨、測試庫、腳本和一個(gè)簡單的應(yīng)用程序示例奕纫，它包含了開發(fā)一個(gè)典型的web應(yīng)用程序所需的基本配置提陶。
對(duì)于本教程，我們對(duì)AngularJS種子項(xiàng)目進(jìn)行了下列更改：
刪除示例應(yīng)用程序匹层；
添加手機(jī)圖像到app/img/phones/隙笆；
添加手機(jī)數(shù)據(jù)文件(JSON)到app/phones/；
添加Twitter Bootstrap文件到app/css/ 和app/img/又固。
練習(xí)
試試把關(guān)于數(shù)學(xué)運(yùn)算的新表達(dá)式添加到index.html：
1 + 2 = {{ 1 + 2 }}
總結(jié)
現(xiàn)在讓我們轉(zhuǎn)到步驟1仲器，將一些內(nèi)容添加到web應(yīng)用程序。
