1.背景介紹
Angular最顯著的特征就是其整合性旁钧。它是由單一項(xiàng)目組常年開(kāi)發(fā)維護(hù)的一體化框架吸重，涵蓋了M、V歪今、C/VM等各個(gè)層面嚎幸，不需要組合、評(píng)估其它技術(shù)就能完成大部分前端開(kāi)發(fā)任務(wù)寄猩。這樣可以有效降低決策成本嫉晶，提高決策速度，對(duì)需要快速起步的團(tuán)隊(duì)是非常有幫助的。Angular 2就是前端開(kāi)發(fā)領(lǐng)域的“宜家套裝”车遂，它經(jīng)過(guò)精心的前期設(shè)計(jì)封断，涵蓋了開(kāi)發(fā)中的各個(gè)層面，層與層之間都經(jīng)過(guò)了精心調(diào)適舶担，是一個(gè)“開(kāi)箱即用”的框架坡疼。
什么是angular-cli
Angular-CLI 是 Google Angular 核心團(tuán)隊(duì)提供的開(kāi)發(fā)工具，集成了大量的 NodeJS 模塊衣陶，例如：webpack柄瑰，karma，asmine剪况，typescript 編譯器等教沾。只要一條命令就能幫你自動(dòng)創(chuàng)建項(xiàng)目的目錄結(jié)構(gòu)、自動(dòng)幫你生成 Component 骨架代碼并自動(dòng)添加依賴译断、自動(dòng)熱加載代碼授翻、對(duì) AngularMaterial2 組件庫(kù)提供了內(nèi)置支持等等
2.知識(shí)剖析
模塊化的技術(shù)
Angular 2很好的踐行了OCP原則以及SoC（關(guān)注點(diǎn)分離）原則。它非常有效的分離了渲染與交互邏輯孙咪，這就讓它可以很好的跟包括React在內(nèi)的渲染引擎搭配使用堪唐，除此之外，它還可以使用內(nèi)存渲染引擎翎蹈，以實(shí)現(xiàn)服務(wù)端渲染淮菠；還可以使用Native渲染引擎，以編譯出真正的原生程序（NativeScript）荤堪。它還分離了數(shù)據(jù)供應(yīng)與變更檢測(cè)邏輯合陵，從而讓它可以自由使用包括RxJS以及ImmutableJS在內(nèi)的第三方數(shù)據(jù)框架/工具。
不僅如此澄阳。在Angular1和2中最具特色的應(yīng)該算是依賴注入(DI)系統(tǒng)了拥知，它把后端開(kāi)發(fā)中用來(lái)解決復(fù)雜問(wèn)題、實(shí)現(xiàn)高彈性設(shè)計(jì)的DI技術(shù)引入了前端碎赢。Angular 2中更是通過(guò)引入TypeScript賦予它更高的靈活性和便利性举庶。不過(guò)，Angular 2并沒(méi)有敝帚自珍揩抡，把它跟框架本身緊緊黏結(jié)在一起，而是把它設(shè)計(jì)成了一個(gè)獨(dú)立可用的模塊镀琉。這就意味著峦嗤，無(wú)論你正在使用什么前端框架，甚至NodeJS后端框架屋摔，都可以自由使用它烁设，并從中獲益。
工具更加完善、簡(jiǎn)單
通過(guò)CLI装黑，你可以創(chuàng)建副瀑、開(kāi)發(fā)、測(cè)試恋谭、構(gòu)建項(xiàng)目糠睡，而不需要額外的依賴。它封裝了實(shí)現(xiàn)細(xì)節(jié)疚颊，如果是新手狈孔，你完全不需要懂Webpack，也不需要自己寫構(gòu)建腳本材义。
更有利于分工
在Angular中均抽，模板、樣式其掂、組件代碼油挥、服務(wù)等都是明確分開(kāi)的。樣式需要精通CSS款熬，服務(wù)需要豐富的設(shè)計(jì)經(jīng)驗(yàn)和架構(gòu)觀深寥。如果不能分工又沒(méi)有足夠敏捷的項(xiàng)目管理。分開(kāi)之后华烟，精通某項(xiàng)技能的人可以去做專項(xiàng)增強(qiáng)翩迈，而不用擔(dān)心意外影響到別人（都不在同一個(gè)文件里），甚至可以打通前后端盔夜，把服務(wù)交給實(shí)現(xiàn)API的后端程序員來(lái)寫
嚴(yán)謹(jǐn)?shù)陌姹景l(fā)布計(jì)劃
Angular開(kāi)發(fā)團(tuán)隊(duì)將遵循嚴(yán)格的語(yǔ)義化版本方式進(jìn)行發(fā)布负饲，摘譯文章參見(jiàn) Angular 的版本號(hào)與發(fā)布周期 。如果你不擔(dān)心Node的版本發(fā)布周期喂链，也沒(méi)必要擔(dān)心Angular的返十。Angular的這種發(fā)布策略，可以兼顧技術(shù)更新與向后兼容椭微，通過(guò)使用這種發(fā)布策略洞坑，Angular在將來(lái)可以安全的不斷引入新技術(shù)，保持和業(yè)界最新的進(jìn)展同步蝇率。
簡(jiǎn)化開(kāi)發(fā)
AngularJS（1）中有70多個(gè)內(nèi)置指令迟杂，而Angular（2+）中只有20多個(gè)，但是能實(shí)現(xiàn)的功能比以前卻多了很多本慕，因?yàn)樾碌慕壎ㄕZ(yǔ)法取代了以前的50多個(gè)內(nèi)置指令和大量第三方指令排拷。
3.常見(jiàn)問(wèn)題
目前中文的學(xué)習(xí)資料較少，且基于ES6锅尘，語(yǔ)法默認(rèn)TypesScipt监氢，采用嚴(yán)格的后端模式，涉及的知識(shí)點(diǎn)比較廣泛。學(xué)習(xí)曲線陡峭浪腐，學(xué)習(xí)成本較大纵揍。
angular2的優(yōu)缺點(diǎn)
5.編碼實(shí)戰(zhàn)
NiceFish（美人魚(yú)）】：這是一個(gè)微型Blog系統(tǒng)，前端基于Angular 4.0.0 + ng-Bootstrap议街。
演示地址：http://121.196.220.118:8081/
項(xiàng)目教程：http://git.oschina.net/mumu-osc/NiceFish
參考文獻(xiàn)
大漠窮秋的博客：
https://my.oschina.net/mumu/blog
