使用AngularJS實現的前后端分離的數據交互過程


一. AngularJS簡介

  1. AngularJS是什么

AngularJS是一個開源Web應用程序框架。最初是由MISKO Hevery和Adam Abrons於2009年開發,現在是由谷歌維護。

  1. AngularJS的特性
  1. AngularJS是一個功能強大的基於JavaScript開發框架用於創建富互聯網應用(RIA)。
  2. AngularJS為開發者提供的選項(使用JavaScript)在一個干凈的MVC(模型-視圖-控制器)的方式來編寫客戶端應用程序。
  3. AngularJS寫的應用都是跨瀏覽器兼容。AngularJS使用JavaScript代碼自動處理適應每種瀏覽器。
  4. AngularJS是開源的,完全免費的,並且由數千名世界各地的開發者開發維護。它是根據Apache許可證2.0版許可發布。
    總體來說,AngularJS是一個用來構建大型應用,高性能的Web應用程序的框架,同時使它們易於維護。
  1. AngularJS的核心特征
  1. 數據綁定: 模型和視圖組件之間的數據自動同步。
  2. 適用范圍: 這些對象參考模型。它們充當控制器和視圖之間的膠水。
  3. 控制器: 這些Javascript函數綁定到特定的范圍。
  4. 服務: AngularJS配有多個內置服務,例如$http可作為一個XMLHttpRequest請求。這些單一對象在應用程序只實例化一次。
  5. 過濾器: 從一個數組的條目中選擇一個子集,並返回一個新的數組。
  6. 指令: 指令是關於DOM元素標記(如元素,屬性,CSS等等)。這些可以被用來創建作為新的,自定義部件的自定義HTML標簽。AngularJS設有內置指令(如:ngBind,ngModel...)
  7. 模板:這些符合從控制器和模型信息的呈現的視圖。這些可以是單個文件(如index.html),或使用“諧音”在一個頁面多個視圖。
  8. 路由: 它是切換視圖的概念。
  9. 模型視圖: MVC是一個設計模式將應用划分為不同的部分(稱為模型,視圖和控制器),每個都有不同的職責。
  10. 深層鏈接: 深層鏈接,可以使應用程序狀態進行編碼在URL中而能夠添加到書簽。應用程序可從URL恢復到相同的狀態。
  11. 依賴注入: AngularJS有一個內置的依賴注入子系統,開發人員通過使應用程序從而更易於開發,理解和測試。

二. 場景簡介

  1. 后端全是REST風格API;
  2. 前端通過AngularJS實現;

三. 前后端交互過程

  1. 前端通過AngularJS的路由功能來區分不同的邏輯頁面並將不同的頁面綁定到對應的控制器上;
  2. 控制器負責將相應的數據和方法綁定到頁面元素並執行相應的操作(包括factory方法的調用);
  3. 工廠方法主要用來動態獲取(REST)頁面的數據,即請求server端的路由(比如:overview/overview),調用相應的路由函數獲取數據;
  4. factory方法通過依賴注入到相應的控制器中。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM