$resource

創(chuàng)建一個(gè)resource對(duì)象的工廠函數(shù)，可以讓你安全的和RESFUL服務(wù)端進(jìn)行數(shù)據(jù)交互。

安裝

ngResource模塊是一個(gè)可選的angularjs模塊，如果需要使用，我們要單獨(dú)引用js

<script type="text/javascript" src="/javascripts/angular-resource.js">

$resource應(yīng)用

我們并不是直接通過(guò)$resource服務(wù)本身同服務(wù)器通信，$resource是一個(gè)創(chuàng)建資源對(duì)象的工廠，用來(lái)創(chuàng)建同服務(wù)端交互的對(duì)象。

var User = $resource('/api/users/:userId', {userId:'@id'});

返回的User對(duì)象包含了同后端服務(wù)進(jìn)行交互的方法，我們可以把User對(duì)象理解成同RESTFul的后端服務(wù)進(jìn)行交互的接口。

該對(duì)象包含兩個(gè)get類型的方法已經(jīng)三個(gè)非get類型的方法。

User.get({id:'123'}, successFn, errorFn);

該方法向url發(fā)送一個(gè)get請(qǐng)求，并期望一個(gè)json類型的響應(yīng)。這里會(huì)向/api/users/123發(fā)送一個(gè)請(qǐng)求，successFn處理請(qǐng)求成功響應(yīng)，errorFn處理錯(cuò)誤。

User.query(params, successFn, errorFn)

同get()方法使用類似，一般用來(lái)請(qǐng)求多條數(shù)據(jù)。

save(params, payload, successFn, errorFn);

save方法會(huì)發(fā)起一個(gè)post請(qǐng)求，params參數(shù)用來(lái)填充url中變量，對(duì)象payload會(huì)作為請(qǐng)求體進(jìn)行發(fā)送

delete(params, payload, successFn,errorFn)

delete方法一個(gè)DELETE請(qǐng)求，payload作為消息體進(jìn)行發(fā)送

remove(params, payload, successFn, errorFn)

同delete類似，不同的是remove用來(lái)移除多條數(shù)據(jù)

通過(guò)$resource生成的對(duì)象來(lái)同服務(wù)器進(jìn)行交互的時(shí)候，我們看可以定義處理成功以及處理失敗的函數(shù)，這些函數(shù)接受的參數(shù)不僅僅是簡(jiǎn)單的對(duì)象，而是經(jīng)過(guò)包裝之后的對(duì)象，會(huì)被添加$save() , $remove() , $delete三個(gè)方法，可以直接調(diào)用這三個(gè)方法來(lái)后服務(wù)端進(jìn)行交互。

User.get({id:'123'}, function(user){
 user.name = 'changeAnotherName';
 user.$save();
//這里等價(jià)于User.save({id:'123'},{name:'changeAnotherName'})
});

$resource擴(kuò)展

$resource對(duì)常見(jiàn)的五種請(qǐng)求進(jìn)行封裝，我們還可以對(duì)$resource進(jìn)行擴(kuò)展。

這里要擴(kuò)展$resource我們需要傳入第三個(gè)參數(shù)，該參數(shù)是一個(gè)對(duì)象。

$resource('/api/users',{},{
 sendEmail:{
  method:'',
  url:'',
  params:{},
  isArray:boolean,
  transformRequest:函數(shù)或者函數(shù)數(shù)組
  transformResponse:函數(shù)或者函數(shù)數(shù)組
  cache:布爾型或緩存對(duì)象
  timeout:數(shù)值或promise對(duì)象
  withCredentials:布爾類型
  responseType:字符串，用來(lái)設(shè)置XMLHttpRequestResponseType屬性
 }
})

我們也可以將$resource服務(wù)當(dāng)做自定義服務(wù)的基礎(chǔ)。

angular.module('testApp', ['ngResource']),factory('UserService',['$resource', function($resource){
  return $resource(url,{},{});
}]);

總結(jié)

以上就是關(guān)于AngularJs中$resource和restfu服務(wù)端數(shù)據(jù)交互的全部?jī)?nèi)容，希望這篇文章對(duì)大家學(xué)習(xí)或者使用AngularJS能有所幫助，如果有疑問(wèn)大家可以留言交流。

最新評(píng)論