Angular.js中$resource高大上的數(shù)據(jù)交互詳解

更新時間：2017年07月30日 15:22:15 作者：野獸''''''''

這篇文章主要給大家介紹了關(guān)于Angular.js中$resource高大上的數(shù)據(jù)交互的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家學(xué)習(xí)或者使用angular.js具有一定的參考學(xué)習(xí)價值，需要的朋友們下面跟著小編來一起看看吧。

本文主要給大家介紹的是關(guān)于Angular.js中$resource數(shù)據(jù)交互的相關(guān)內(nèi)容，分享出來供大家參考學(xué)習(xí)，下面來一起看看詳細的介紹：

$resource

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

需要注入 ngResource 模塊。angular-resource[.min].js

默認(rèn)情況下，末尾斜杠（可以引起后端服務(wù)器不期望出現(xiàn)的行為）將從計算后的URL中剝離。

這個可以通過$resourceProvider配置：

 app.config(["$resourceProvider",function($resourceProvider){
 $resourceProvider.defaults.stripTrailingSlashes = false;
 }])

依賴：$http

使用：$resource(url,[paramDefaults],[actions],options);

url:一個參數(shù)化的url模板，帶有前綴參數(shù)(如：/user/:username)。如果你使用的是帶端口號的URL(如：http://example.com:8080/api)，則需要慎重考慮。如果帶有后綴(如：http://example.com/resource.json 或者 http://example.com/:id.json 或者 http://example.com/resource/:resource_id.:format) 。如果后綴之前的參數(shù)是空的，在這情況下:resource_id 比 /.優(yōu)先執(zhí)行，如果你需要這個序列出現(xiàn)而不崩潰，那么你可以通過/\.避免。

paramDefaults:url參數(shù)的默認(rèn)值，這些可以在方法重寫。如果參數(shù)的任何一個值是函數(shù)，它將作為每一次請求獲取的參數(shù)值而被執(zhí)行(除非該參數(shù)被忽略的)。

參數(shù)對象中的每個鍵值對都是先綁定到一個url模板，任何多余的密鑰都被附加到url query的“？”后。 /path/:verb +{verb:'greet',salutation:'hello'} => /path/greet?salutation=hello

actions: 用戶對于resource行為的默認(rèn)設(shè)置進行擴展的自定義配置的散列，該配置將會以$http.config的格式創(chuàng)建。

action: 字符串，action的名稱，這個名稱將成為resource對象方法的名稱。

method：字符串，http方法（不區(qū)分大小寫，如GET, POST, PUT, DELETE, JSONP等）。

params：對象，這次行動預(yù)先設(shè)定的參數(shù)。如果任何參數(shù)的值是一個函數(shù)，當(dāng)一個參數(shù)值每一次需要獲得請求時都會被執(zhí)行（除非該參數(shù)被忽略的）。

url：字符串，行為指定的網(wǎng)址。

isArray：boolean，如果為true，那么這個行為返回的對象是個數(shù)組。

transformRequest：函數(shù)/函數(shù)的數(shù)組。轉(zhuǎn)換函數(shù)或者一個包含轉(zhuǎn)換函數(shù)的數(shù)組。轉(zhuǎn)換函數(shù)獲取http請求體和請求頭，并且返回他們的轉(zhuǎn)換版（通常是序列化）。

transformResponse：函數(shù)/函數(shù)的數(shù)組。轉(zhuǎn)換函數(shù)或者一個包含轉(zhuǎn)換函數(shù)的數(shù)組。轉(zhuǎn)換函數(shù)獲取http響應(yīng)體和響應(yīng)頭，并且返回他們的轉(zhuǎn)換版（通常是序列化）。

cache：boolean，如果為true，一個默認(rèn)的$http緩存將被作為請求的緩存，否則如果存在一個用$cacheFactory創(chuàng)建的緩存實例，則將用于緩存。

timeout：數(shù)值，毫秒，超時則讓請求中止。

withCredentials：boolean，是否設(shè)置withcredentials flag的XHR對象。查看更多信息的憑據(jù)。

responseType：字符串，響應(yīng)頭類型。

interceptor：對象，攔截對象有兩個可選方法-response和responseError。

Options：擴展$resourceProvider行為的自定義設(shè)置，唯一支持的選項是stripTrailingSlashes,boolean類型，如果為真，url尾部的斜杠會被移除（默認(rèn)為true）。

五種默認(rèn)行為：

{

　　“get”:{method:“get”},

　　“save”:{method:“post”}

　　“query”:{method:“get”,isArray:true}

　　“remove”:{method:“delete”}

　　“delete”:{method:“delete”}

}

get([params],[success],[error]);

save([params],postData,[success],[error]);

query([params],[success],[error]);

remove([params],postData,[success],[error]);

delete([params],postData,[success],[error]);

$save([params],[success],[error]);

$remove([params],[success],[error]);

使用代碼：

(function () {
 angular.module("Demo", ["ngResource"])
 .controller("testCtrl", ["$resource",testCtrl]);
 function testCtrl($resource) {
  var myResource = $resource("/url/_url", {}, {
  myPost: {
   method: "post",
   url: "/newUrl/_newUrl",
   params: { id: "4" },
   interceptor: {
   response: function (d) {
    console.log(d);
   },
   responseError: function (d) {
    console.log(d);//這里的是隨便寫的地址，所以執(zhí)行了error里的函數(shù)，可打印看參數(shù)及結(jié)果
   }
   }
  }
  });
  myResource.get({ id: "1" }, function (d) {
  console.log(d);
  }, function (d) {
  console.log(d);//這里的是隨便寫的地址，所以執(zhí)行了error里的函數(shù)，可打印看參數(shù)及結(jié)果
  });
  myResource.query({ content: "text" }, function (d) {
  console.log(d);
  }, function (d) {
  console.log(d);//這里的是隨便寫的地址，所以執(zhí)行了error里的函數(shù)，可打印看參數(shù)及結(jié)果
  });
  myResource.save({ text: "Hello World" }, { text: "Hello World" }, function (d) {
  console.log(d);
  }, function (d) {
  console.log(d);//這里的是隨便寫的地址，所以執(zhí)行了error里的函數(shù)，可打印看參數(shù)及結(jié)果
  });
  myResource.remove({ text: "Hello World" }, { text: "Hello World" }, function (d) {
  console.log(d);
  }, function (d) {
  console.log(d);//這里的是隨便寫的地址，所以執(zhí)行了error里的函數(shù)，可打印看參數(shù)及結(jié)果
  });
  myResource.delete({ text: "Hello World" }, { text: "Hello World" }, function (d) {
  console.log(d);
  }, function (d) {
  console.log(d);//這里的是隨便寫的地址，所以執(zhí)行了error里的函數(shù)，可打印看參數(shù)及結(jié)果
  });
  var newResource = new myResource();
  newResource.$save({ id: "2" }, function (d) {
  console.log(d);
  }, function (d) {
  console.log(d);//這里的是隨便寫的地址，所以執(zhí)行了error里的函數(shù)，可打印看參數(shù)及結(jié)果
  });
  newResource.$remove({ id: "3" }, function (d) {
  console.log(d);
  }, function (d) {
  console.log(d);//這里的是隨便寫的地址，所以執(zhí)行了error里的函數(shù)，可打印看參數(shù)及結(jié)果
  });
  myResource.myPost();
 };
 }());

關(guān)于$resource，這里只是簡單的介紹和使用，本獸對$resource的理解也不會很深(很少用到restful)，希望有人交流相關(guān)問題。

總結(jié)

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對腳本之家的支持

您可能感興趣的文章: