1. 程式人生 > >AngularJs 學習 (二)

AngularJs 學習 (二)

http請求 需要 exp UC AC 技術 一個 uno 技術分享

緊接著第一部分:

推薦閱讀: http://adrianmejia.com/blog/2014/10/03/mean-stack-tutorial-mongodb-expressjs-angularjs-nodejs/

源項目: git clone https://github.com/amejiarosario/todoAPIjs.git

首先介紹下AngularJS是一個由模型(Model)、視圖(View)、控制器(Controller)組成

  Model: 用來處理數據,包括兌取和設置數據,一般是指操作數據庫。Model定義了應用層數據,它是獨立於用戶界面的,在AngularJS中,Model的應用非常簡單,

可以理解為一個Model就是一個對象。

  View: 在Web應用中,視圖就是HTML網頁,是用來展示Model數據的。在AngularJs中,數據與模板引擎相結合,在加上AngularJs的指令(Directives),從而構建了一個

豐富的HTML頁面。

  Controller: 控制器是用來操作Model中的數據的,在AngularJS應用中,控制器是通過controller()方法來創建JavaScript函數的。一個模塊裏面可能用多個模型和視圖,控制器

就起到了鏈接模型和視圖的作用。

技術分享圖片

頁面跳轉: 頁面跳轉就需要設計控制器,模板(視圖),路由(Router)

  其中Router由AngularJS中的$routeProvider, 這是AngularJS中的一個服務

$index: 這個是Angular自帶的索引值,一般配合ng-repeat 使用

$http: $http是AngularJS的內置服務,通過他可以直接與後臺進行服務器通信。$http知識簡單地封裝了瀏覽器原生地XMLHttpRequest對象。

$http服務是只能接收一個參數的函數。這個參數就是一個對象,包含了用來生成HTTP請求的配置內容;詳情展示

基於$resource的工廠方法:

  $http是一種快捷的網絡請求服務,除此之外,AngularJS還提供了另外一個服務----$rescouce. $resouce對$http做了一層封裝。用它來處理

ResetfulAPI會更加快捷。

  $resource 已經封裝好的方法:

  

{ get:    {method:GET},  // 讀取一條記錄
  save:   {method:POST}, // create record
  query:  {method:GET, isArray:true}, // get list all records
  remove: {method:DELETE}, // remove record
  delete: {method:DELETE} }; // same, remove record

上面的還缺少了一種方法就是update, 這個方法可以再$resource中進行添加

$resource(‘‘, null , { ‘update‘: {method: ‘PUT‘}

小tips:

  跳轉頁面 $location.url(‘/‘)

AngularJs 學習 (二)