AngularJS 是什么?

AngularJS是一個開源Web應用程序框架。它最初是由Misko Hevery和Adam Abrons開發(fā)于2009年?，F(xiàn)在是由谷歌維護。

AngularJS的定義，它的官方文檔介紹如下：

AngularJS是動態(tài)的Web應用程序結(jié)構(gòu)框架。它可以讓你使用HTML作為模板語言，擴展HTML的語法清晰，簡潔地表達應用程序的組件。Angular分明的數(shù)據(jù)綁定和依賴注入必須編寫代碼。而這一切都在瀏覽器內(nèi)發(fā)生，這使得它與任何服務器技術(shù)的理想合作伙伴。

特點

• AngularJS是一個功能強大的基于JavaScript開發(fā)框架來創(chuàng)建富互聯(lián)網(wǎng)應用（RIA）。

• AngulajJS為開發(fā)者提供選項來編寫客戶端應用程序（使用JavaScript）在一個干凈的MVC（模型 - 視圖 - 控制器）的方式。

• AngularJS應用是跨瀏覽器兼容的。自動AngularJS處理適用于每個瀏覽器的javascript代碼。

• AngularJS是開源的，完全免費的，并且由數(shù)千名世界各地的開發(fā)。它是根據(jù)Apache許可證2.0版許可。

總體而言，AngularJS是一個框架可以用來構(gòu)建大規(guī)模，高性能的網(wǎng)絡應用，同時也易于維護。

核心功能

以下是AngularJS的最重要的核心的功能：

• 數(shù)據(jù)綁定：它是模型和視圖組件之間的數(shù)據(jù)的自動同步。

• 適用范圍：這些是指模型對象。充當控制器和視圖之間的膠水。

• 控制器：這些是綁定到特定范圍的Javascript函數(shù)。

• 服務：AngularJS配有多個內(nèi)置的服務，例如$http提供XMLHttpRequest。這些是在應用程序?qū)嵗淮蔚膯我粚ο蟆?/p>

• 過濾器：這些從數(shù)組項目中選擇一個子集，并返回一個新的數(shù)組。

• 指令：指令是關(guān)于DOM元素標記（如元素，屬性，CSS等等）。這些可以被用來創(chuàng)建作為新的自定義窗口小部件自定義的HTML標簽。 AngularJS有內(nèi)置的指令（ngBind，ngModel...）

• 模板：這些都與控制器和模型信息呈現(xiàn)的視圖。這些可以使用“諧音”的單個文件（如index.html），或在一個頁面上的多個視圖。

• 路由：它是切換視圖的概念。

• 模型 - 視圖 ：MVC是一個設計模式將應用劃分為不同的部分（稱為模型，視圖和控制器），每一個具有不同的責任。 AngularJS沒有傳統(tǒng)意義上的MVC實現(xiàn)，而是更接近于MVVM（模型 - 視圖 - 視圖模型）。AngularJS團隊讓它作為模型視圖而不管。

• 深層鏈接：深層鏈接能夠使其可書簽應用程序的狀態(tài)進行編碼的URL。應用程序可以從該URL為相同的狀態(tài)恢復。

• 依賴注入： AngularJS有一個內(nèi)置的依賴注入子系統(tǒng)，通過使應用程序幫助開發(fā)人員更易于開發(fā)，理解和測試。

概念

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

AngularJS的優(yōu)點

• AngularJS提供在一個非常干凈和維護方式來創(chuàng)建單頁的應用。

• AngularJS提供了數(shù)據(jù)綁定功能為HTML從而給用戶提供豐富而敏感的體驗

• AngularJS代碼可單元測試。

• AngularJS使用依賴注入和運用關(guān)注點分離。

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

• AngularJS能為開發(fā)人員編寫更少的代碼，并獲得更多的功能。

• 在AngularJS，視圖都是純HTML頁面，并用JavaScript編寫控制器完成業(yè)務處理。

AngularJS應用程序可以在所有主要瀏覽器和智能手機，包括Android和iOS系統(tǒng)的手機/平板電腦上運行。

AngulaJS的缺點

雖然AngularJS帶有許多加分，但是我們應該考慮以下幾點：

• 不安全：JavaScript只有框架編寫的應用程序在AngularJS是不安全的。服務器端的認證和授權(quán)是必須的，以保持應用程序的安全。

• 不可降解：如果應用程序的用戶禁用JavaScript的話用戶將只能看到基本的頁面，僅此而已。

AngularJS組件

AngularJS框架可分為以下三個主要部分組成：

• ng-app : 該指令規(guī)定，并鏈接一個AngularJS應用程序的HTML。

• ng-model : 該指令結(jié)合AngularJS應用數(shù)據(jù)的值到HTML的輸入控件。

• ng-bind : 該指令子帶AngularJS應用數(shù)據(jù)的HTML標簽。