AngularJS 簡介

AngularJS是一個(gè)開放源代碼的Web應(yīng)用程序框架。它最初由Misko Hevery和Adam Abrons于2009年開發(fā)。現(xiàn)在由Google維護(hù)。它的最新版本是1.2.21。

官方文檔中對AngularJS的定義如下-

AngularJS是動態(tài)Web應(yīng)用程序的結(jié)構(gòu)框架。它使您可以將HTML用作模板語言，并可以擴(kuò)展HTML的語法以清晰，簡潔地表達(dá)應(yīng)用程序組件。它的數(shù)據(jù)綁定和依賴性注入消除了您當(dāng)前必須編寫的許多代碼。這一切都發(fā)生在瀏覽器內(nèi)，使其成為任何服務(wù)器技術(shù)的理想合作伙伴。

一般功能

AngularJS的一般功能如下-

• AngularJS是可以創(chuàng)建富互聯(lián)網(wǎng)應(yīng)用程序(RIA)的高效框架。

• AngularJS為開發(fā)人員提供了一種選擇，可以使用JavaScript以干凈的Model View Controller(MVC)方式編寫客戶端應(yīng)用程序。

• 用AngularJS編寫的應(yīng)用程序兼容跨瀏覽器。AngularJS自動處理適合每個(gè)瀏覽器的JavaScript代碼。

• AngularJS是開源的，完全免費(fèi)，并且被全世界成千上萬的開發(fā)人員所使用。它是根據(jù)Apache許可版本2.0許可的。

總體而言，AngularJS是一個(gè)框架，用于構(gòu)建大規(guī)模，高性能且易于維護(hù)的Web應(yīng)用程序。

核心功能

AngularJS的核心功能如下-

• Data-binding ? 這是模型和視圖組件之間的數(shù)據(jù)自動同步。

• Scope ? 這些是引用模型的對象。它們充當(dāng)控制器和視圖之間的粘合劑。

• Controller ? 這些是綁定到特定范圍的JavaScript函數(shù)。

• Services ? AngularJS附帶了一些內(nèi)置服務(wù)，例如$http來生成XMLHttpRequests。這些是單例對象，僅在應(yīng)用程序中實(shí)例化一次。

• Filters ? 這些從數(shù)組中選擇項(xiàng)的子集并返回一個(gè)新數(shù)組。

• Directives ? 偽指令是DOM元素（例如元素，屬性，css等）上的標(biāo)記。這些可用于創(chuàng)建用作新的自定義小部件的自定義HTML標(biāo)簽。AngularJS具有內(nèi)置指令，例如ngBind，ngModel等。

• Templates ? 這些是具有來自控制器和模型的信息的渲染視圖。這些可以是單個(gè)文件（例如index.html），也可以是使用partials在一頁中的多個(gè)視圖。

• Routing ? 是切換視圖的概念。

• Model View Whatever ? MVW是一種設(shè)計(jì)模式，用于將應(yīng)用程序分為不同的部分，分別稱為模型，視圖和控制器，每個(gè)部分都有不同的職責(zé)。AngularJS并沒有實(shí)現(xiàn)傳統(tǒng)意義上的MVC，而是更接近MVVM(Model-View-ViewModel)。Angular JS團(tuán)隊(duì)幽默地將其稱為“模型視圖”。

• Deep Linking ? 深度鏈接允許在URL中對應(yīng)用程序的狀態(tài)進(jìn)行編碼，以便可以將其添加為書簽。然后可以將應(yīng)用程序從URL還原到相同狀態(tài)。

• Dependency Injection ? AngularJS具有內(nèi)置的依賴項(xiàng)注入子系統(tǒng)，可幫助開發(fā)人員輕松創(chuàng)建，理解和測試應(yīng)用程序。

概念

下圖描述了AngularJS的一些重要部分，我們將在隨后的章節(jié)中詳細(xì)討論。

AngularJS的優(yōu)勢

AngularJS的優(yōu)點(diǎn)是-

• 它提供了以非常干凈且可維護(hù)的方式創(chuàng)建單頁應(yīng)用程序的功能。

• 它提供了到HTML的數(shù)據(jù)綁定功能。因此，它為用戶提供了豐富而響應(yīng)迅速的體驗(yàn)。

• AngularJS代碼可進(jìn)行單元測試。

• AngularJS使用依賴注入并利用關(guān)注點(diǎn)分離。

• AngularJS提供了可重用的組件。

• 使用AngularJS，開發(fā)人員可以用短代碼實(shí)現(xiàn)更多功能。

• 在AngularJS中，視圖是純HTML頁面，用JavaScript編寫的控制器進(jìn)行業(yè)務(wù)處理。

最重要的是，AngularJS應(yīng)用程序可以在所有主要的瀏覽器和智能手機(jī)上運(yùn)行，包括基于Android和iOS的手機(jī)/平板電腦。

AngularJS的缺點(diǎn)

盡管AngularJS具有很多優(yōu)點(diǎn)，但這里有一些需要注意的地方-

• 安全 ?作為純JavaScript框架，用AngularJS編寫的應(yīng)用程序是不安全的。服務(wù)器端身份驗(yàn)證和授權(quán)是保證應(yīng)用程序安全的必要條件。

• 失效 ? 如果您的應(yīng)用程序用戶禁用了JavaScript，則除了基本頁面外，其他任何內(nèi)容均不可見。

AngularJS指令

AngularJS框架可以分為三個(gè)主要部分-

• ng-app ? 該指令定義了AngularJS應(yīng)用程序并將其鏈接到HTML。

• ng-model ? 此偽指令將AngularJS應(yīng)用程序數(shù)據(jù)的值綁定到HTML輸入控件。

• ng-bind ? 該指令將AngularJS應(yīng)用程序數(shù)據(jù)綁定到HTML標(biāo)簽。