AngularJS 使用$resource資源

2018-07-26 17:11 更新

在定義了資源之后,我們看如果使用這些資源,發(fā)出請求:

var book = Book.read({id: '123'}, function(response){
  console.log(response);
});

這里我們進行 Book 的“類”方法調(diào)用。在方法的使用上,根據(jù)官方文檔:

HTTP GET "class" actions: Resource.action([parameters], [success], [error])
non-GET "class" actions: Resource.action([parameters], postData, [success], [error])
non-GET instance actions: instance.$action([parameters], [success], [error])

我們這里是第二種形式,即類方法的非 GET 請求。我們給的參數(shù)會作為 postData 傳遞。如果我們需要 GET 參數(shù),并且還需要一個錯誤回調(diào),那么:

var book = Book.read({get: 'haha'}, {id: '123'},
  function(response){
    console.log(response);
  },
  function(error){
    console.log(error);
  }
);

調(diào)用之后,我們會立即得到的 book ,它是 Book 類的一個實例。這里所謂的實例,實際上就是先把所有的 action 加一個 前綴放到一個空對象里,然后把發(fā)出的參數(shù)填充進去。等請求返回了,把除 action 以外的成員刪除掉,再把請求返回的數(shù)據(jù)填充到這個對象當(dāng)中。所以,如果我們這樣:

var book = Book.read({id: '123'}, function(response){
  console.log(book);
});
console.log(book)

就能看到 book 實例的變化過程了。

現(xiàn)在我們得到一個真實的實例,看一下實例的調(diào)用過程:

//響應(yīng)的數(shù)據(jù)是 {result: 0, msg: '', obj: {id: 'xxx'}}
var book = Book.create({title: '測試標(biāo)題', author: '測試作者'}, function(response){
  console.log(book);
});

可以看到,在請求回調(diào)之后, book 這個實例的成員已經(jīng)被響應(yīng)內(nèi)容填充了。但是這里有一個問題,我們返回的數(shù)據(jù),并不適合一個 book 實例。格式先不說,它把 title 和 author 這些信息都丟了(因為響應(yīng)只返回了 id )。

如果僅僅是格式問題,我們可以通過配置 $http 服務(wù)來解決( AJAX 請求都要使用 $http 服務(wù)的):

$http.defaults.transformResponse = function(data){return angular.fromJson(data).obj};

當(dāng)然,我們也可以自己來解決一下丟信息的問題:

var p = {title: '測試標(biāo)題', author: '測試作者'};
var book = Book.create(p, function(response){
  angular.extend(book, p);
  console.log(book);
});

不過,始終會有一些不方便了。比較正統(tǒng)的方式應(yīng)該是調(diào)節(jié)服務(wù)器端的響應(yīng),讓服務(wù)器端也具有和前端一樣的實例概念,返回的是完整的實例信息。即使這樣,你也還要考慮格式的事。

現(xiàn)在我們得到了一個真實的 book 實例了,帶有 id 信息。我們嘗試一下實例的方法調(diào)用,先回過去頭看一下那三種調(diào)用形式,對于實例只有第三種形式:

non-GET instance actions: instance.$action([parameters], [success], [error])

首先解決一個疑問,如果一個實例是進行一個 GET 的調(diào)用會怎么樣?沒有任何問題,這當(dāng)然沒有任何問題的,形式和上面一樣。

如何實例是做 POST 請求的話,從形式上看,我們無法控制請求的 postData ?是的,所有的 POST 請求,其 postData 都會被實例數(shù)據(jù)自動填充,形式上我們只能控制 params 。

所以,如果是在做修改調(diào)用的話:

book.$update({title: '新標(biāo)題', author: '測試作者'}, function(response){
  console.log(book);
});

這樣是沒有意義的并且錯誤的。因為要修改的數(shù)據(jù)只是作為 GET 參數(shù)傳遞了,而 postData 傳遞的數(shù)據(jù)就是當(dāng)前實例的數(shù)據(jù),并沒有任何修改。

正確的做法:

book.title = '新標(biāo)題'
book.$update(function(response){
  console.log(book);
});

顯然,這種情況下,回調(diào)都可以省了:

book.title = '新標(biāo)題'
book.$update();


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號