一、$resource服务介绍
$http服务提供的实现极为简单和低级，可以用来发送XHR请求，同时它还为你提供了很大的可控性和灵活性。但是，在大多数情况下，我们需要处理对象，以及封装了特定属性和方法的对象模型，例如一个person对象（带有详细信息），或者一个信用卡对象。
$resource就是为这一功能而设计的。AngularJS中的resource(资源)允许我们用描述性的方式来定义对象模型，它可以描述以下内容：
- 资源在服务端的URL。
- 常用的请求参数类型。
- 一些附加的方法（你可以自动获得get、save、query、remove和delete方法），这些方法为对象模型包装了特定的功能和业务逻辑（例如信用卡对象的charge()方法）。
- 期望获得的响应类型（一个数组或者一个对象）。
- 协议头。
使用Angular所提供的$resource对象，你可以根据各种需求查询服务器；除此之外，你还可以把服务端返回的对象当成已经持久好的数据模型，你可以修改它们，并且可以把它们持久化。
ngResource是一个独立的、可选的模块，因此，并没有默认包含在Angular中， 为了使用它，需要：
1、在加载的脚本文件中包含angular-resource.js.
例如： <script src="/UploadFiles/2021-04-02/angular-resource.min.js">
2、在模块依赖声明中包含ngResource
例如: angular.module(‘myapp', [‘ngResource'])
3、在需要的地方使用注入的$resource服务。
格式： var obj=$resource(url,[,paramsDefaults],[,actions])
obj表示请求服务器指定url地址后返回的`$resource`对象，该对象中就包含了**与服务端进行数据交互的全部API**。
参数url表示请求服务器的地址，其中允许占位符变量，该变量必须以`:`为前缀
例如：
`var obj=$resource('url"htmlcode">
var obj=`$resource`('url"htmlcode">
var boj=$resource('url"color: #ff0000">二、 $resource服务所返回娿对象中所包含的5个与服务端交互常用API
1、$resource服务返回对象中的GET类型请求
包含两个api，分别为get query，调用格式如下：
var obj=$resource('url');
//get()方法
obj.get(params,successFn,errorFn);
//query方法
obj.query(params,successFn,errorFn);
这两个api的请求参数相同，区别在于，**get返回值可以是单个资源，但是query必须返回一个数组或集合类的资源。**
2、$resource服务返回对象中的非GET类型请求
包含3个api，分别为save delete remove，调用格式如下：
var obj=$resource('url');
//save()方法
obj.save(params,postData,successFn,errorFn);
//delete方法
obj.save(params,postData,successFn,errorFn);
//remove方法
obj.save(params,postData,successFn,errorFn);
其中，delete方法和remove方法作用享用，区别在于remove可以解决IE浏览器中delete是Javascript保留字而导致的错误问题。
<div ng-controller='myController'>
<ul>
<li ng-repeat='item in items'>
<span>{{item.Code}}</span>
<span>{{item.Name}}</span>
<span>{{item.Gender}}</span>
</li>
</ul>
<div>
Key: <input type="text" ng-model='key' />
<button ng-click='save()'>保存</button>
<div>{{result}}</div>
</div>
</div>
<script type="text/javascript">
angular.module('myapp',['ngResource'])
.config(function($httpProvider){
$httpProvider.defaults.transformRequest=function(obj){
var arrStr=[];
for(var p in obj){
arrStr.push(encodeURIComponent(p)+"="+encodeURIComponent(obj[p]));
}
return arrStr.join("&");
};
$httpProvider.defaults.headers.post={
'Content-Type':'application/x-www-form-urlencoded'
}
})
.controller('myController',['$scope','$resource',function($scope,$resource){
var stus=$resource('/info');
///info"保存失败";
});
}
}])
</script>
对应的服务器端文件，使用了Express架构，核心代码如下：
//对于query请求
app.get('/info',function(req,res){
var info=[
{Code:'1001',Name:'zhangsan',Gender:'female'},
{Code:'1002',Name:'lisi',Gender:'male'}
];
res.status(200).json(info);
});
//对于save请求
app.post('/info',function(req,res){
if(req.body.key=='1001'){
res.send('1');
}else{
res.send('0')
}
});
三、在$resource服务中自定义请求方法
var obj=$resource(url,[,paramsDefaults],[,actions])
在第三个可选参数中，通过key/value的方式自定义。
<div ng-controller='myController'>
<div>
<div>{{r0}}</div>
<div>{{r1}}</div>
<div>{{r2}}</div>
<button ng-click='click()'>开始</button>
</div>
</div>
<script type="text/javascript">
var url='/self"="+encodeURIComponent(obj[p]));
}
return arrStr.join("&");
};
$httpProvider.defaults.headers.post={
'Content-Type':'application/x-www-form-urlencoded'
}
})
.factory('custom',['$resource',function($resource){
return $resource(url,{act:'search'},
{
update:{
method:'POST',//使用POST方式请求服务器
params:{
update:true
},
isArray:false //表示调用该方法后，服务器返回的数据可以不是一个数组
}
});
}])
.controller('myController',['$scope','custom',function($scope,custom){
$scope.click=function(){
//这里的id是放在url后面的，/self"htmlcode">
// /self"color: #ff0000">总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。
杰网资源 Design By www.escxy.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！
如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
杰网资源 Design By www.escxy.com
暂无评论...
《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线
暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。
艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒 经典版》的玩家都可以获得奖励。