經(jīng)過(guò)漫長(zhǎng)的等待,終于等到了ng2發(fā)布秸滴。相比較ng1而言武契,ng2的變化還是顯而易見(jiàn)的。本文將帶領(lǐng)小伙伴們荡含,一起快速上手玩轉(zhuǎn)ng2咒唆。
一、工欲善其事释液,必先利其器全释。
快速安裝Angular-CLI。CLI是谷歌Angular核心團(tuán)隊(duì)提供的一個(gè)項(xiàng)目快速構(gòu)建工具(平臺(tái))均澳,對(duì)于我這樣貪玩的人來(lái)講可謂神兵利器恨溜。
首先確保nodejs已經(jīng)正確安裝符衔,然后檢查一下npm找前。一切正常,在命令行輸入如下命令:
npm install -g angular-cli
注意判族,由于腳手架已經(jīng)改名字躺盛,現(xiàn)在使用npm install -g @angular/cli
安裝。
耐心等待幾分鐘形帮,等待腳手架安裝完畢槽惫。爾后輸入如下命令周叮,檢查一下是否真的安裝完成:
E:\> ng --version
二、躍躍欲試界斜,創(chuàng)建第一個(gè)ng2項(xiàng)目
通過(guò)cli快速的構(gòu)建一個(gè)ng2項(xiàng)目仿耽,只需要使用ng new 命令就能完成。具體如下:
E:\>ng new hello-world
三各薇、一切就緒项贺,讓我調(diào)試一下
不出意外第一個(gè)ng2項(xiàng)目已經(jīng)構(gòu)建完畢,接下來(lái)我們將一起見(jiàn)證一下運(yùn)行后的效果峭判。
//進(jìn)入項(xiàng)目文件目錄
E:\>cd hello-world
//啟動(dòng)項(xiàng)目
E:\hello-world>ng serve
當(dāng)webpack將項(xiàng)目編譯成功后开缎,便可以在瀏覽器中輸入http://localhost:4200/來(lái)訪問(wèn),效果如下圖林螃。
PS:Angular是比較優(yōu)秀的一款JS框架奕删,不管是雙向數(shù)據(jù)綁定,還是依賴注入都讓它變得越來(lái)越好玩疗认。