详解AngularJS中$http缓存以及处理多个$http请求的方法


Posted in Javascript onFebruary 06, 2016

$http 是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。在AngularJS的实际项目中,经常需要处理多个$http请求,每个$http请求返回一个promise,我们可以把多个promise放到$q.all()方法接受的一个数组实参中去。

1.处理多个$http请求

angular.module('app',[])
.controller('AppCtrl', function AppCtrl(myService){
var app = this;
myService.getAll().then(function(info){
app.myInfo = info;
})
})
.service('myService', function MyService($http, $q){
var myService = this;
user = 'https://api...',
repos = '',
events = '';
myService.getData = function getData(){
return $http.get(user).then(function(userData){
return {
name:userData.data.name,
url:userData.data.url,
repoCount: userData.data.count
}
})
};
myService.getUserRepos = function getUserRepos(){
return $http.get(repos).then(function(response){
return _.map(response.data, function(item){
return {
name: item.name,
description:item.description,
starts: item.startCount
}
})
})
}
myService.getUserEvents = function getUserEvents(){
...
}
myService.getAll = function(){
var userPromise = myService.getData(),
userEventsPromise = myService.getUserRepos(),
userReposPromise = myService.getUserRepos();
return $q.all([userPromise, userEventsPromise, userReposPromise]).then(function(){
....
})
}
})

2.$http请求缓存

$http的get方法第二个形参接受一个对象,该对象的cache字段可以接受一个bool类型实现缓存,即{cache:true},也可以接受一个服务。

通过factory方式创建一个服务,并把该服务注入到controller中去。

angular.module('app',[])
.factory("myCache", function($cacheFactory){
return $cacheFactory("me");
})
.controller("AppCtrl", function($http, myCache){
var app = this;
app.load = function(){
$http.get("apiurl",{cache:myCache})
.success(function(data){
app.data = data;
})
}
app.clearCache = function(){
myCache.remove("apiurl");
}
})

小编总结:

● 实际上,实现缓存机制的是$cacheFactory
● 通过{cache:myCache}把缓存机制放在当前请求中
● $cacheFactory把请求api作为key,所以清楚缓存的时候,也是根据这个key来清除缓存

以上所述是小编给大家分享的AngularJS中$http缓存以及处理多个$http请求的方法,希望对大家有所帮助。

Javascript 相关文章推荐
js实现点击注册按钮开始读秒倒计时的小例子
May 11 Javascript
js中浮点型运算BUG的解决方法说明
Jan 06 Javascript
一个简单的实现下拉框多选的插件可移植性比较好
May 05 Javascript
jquery实现带渐变淡入淡出并向右依次展开的多级菜单效果实例
Aug 22 Javascript
jquery插件tytabs.jquery.min.js实现渐变TAB选项卡效果
Aug 25 Javascript
jquery mobile开发常见问题分析
Jan 21 Javascript
基于cssSlidy.js插件实现响应式手机图片轮播效果
Aug 30 Javascript
Mint-UI时间组件起始时间问题及时间插件使用
Aug 20 Javascript
微信小程序支付前端源码
Aug 29 Javascript
详解vue后台系统登录态管理
Apr 02 Javascript
jQuery操作cookie的示例代码
Jun 05 jQuery
基于Ionic3实现选项卡切换并重新加载echarts
Sep 24 Javascript
JavaScript中数组添加值和访问值常见问题
Feb 06 #Javascript
详解Angularjs filter过滤器
Feb 06 #Javascript
Angularjs中如何使用filterFilter函数过滤
Feb 06 #Javascript
浅析Javascript匿名函数与自执行函数
Feb 06 #Javascript
JS通过Cookie判断页面是否为首次打开
Feb 05 #Javascript
JavaScript判断图片是否已经加载完毕的方法汇总
Feb 05 #Javascript
jquery实现的判断倒计时是否结束代码
Feb 05 #Javascript
You might like
php 广告点击统计代码(php+mysql)
2018/02/21 PHP
JS提交并解析后台返回的XML的代码
2008/11/03 Javascript
javascript Object与Function使用
2010/01/11 Javascript
jquery下checked取值问题的解决方法
2012/08/09 Javascript
jquery 自定义容器下雨效果可将下雨图标改为其他
2014/04/23 Javascript
javascript实现禁止右键和F12查看源代码
2014/12/26 Javascript
jQuery表单域属性过滤器用法分析
2015/02/10 Javascript
jQuery层动画定位滑动效果的方法
2015/04/30 Javascript
解析Node.js基于模块和包的代码部署方式
2016/02/16 Javascript
BootStrap实现响应式布局导航栏折叠隐藏效果(在小屏幕、手机屏幕浏览时自动折叠隐藏)
2016/11/30 Javascript
AngularJS通过ng-route实现基本的路由功能实例详解
2016/12/13 Javascript
jQuery插件echarts去掉垂直网格线用法示例
2017/03/03 Javascript
Cpage.js给组件绑定事件的实现代码
2017/08/31 Javascript
select标签设置默认选中的选项方法
2018/03/02 Javascript
微信小程序购物车、父子组件传值及calc的注意事项总结
2018/11/14 Javascript
js时间戳转yyyy-MM-dd HH-mm-ss工具类详解
2019/04/30 Javascript
vue中如何实现后台管理系统的权限控制的方法步骤
2019/09/05 Javascript
一文秒懂JavaScript构造函数、实例、原型对象以及原型链
2020/08/25 Javascript
在Python中使用itertools模块中的组合函数的教程
2015/04/13 Python
详解Python中expandtabs()方法的使用
2015/05/18 Python
python检查序列seq是否含有aset中项的方法
2015/06/30 Python
python实现简单五子棋游戏
2019/06/18 Python
python支持多线程的爬虫实例
2019/12/21 Python
keras .h5转移动端的.tflite文件实现方式
2020/05/25 Python
python dict乱码如何解决
2020/06/07 Python
南京某软件公司的.net面试题
2015/11/30 面试题
杭州-DOTNET笔试题集
2013/09/25 面试题
工作表现自我评价
2014/02/08 职场文书
室内拓展活动方案
2014/02/13 职场文书
党校学习心得体会范文
2014/09/09 职场文书
群众路线教育实践活动学习笔记内容
2014/11/06 职场文书
工作自我评价范文
2015/03/05 职场文书
小学生作文之《压岁钱的烦恼》
2019/09/27 职场文书
只用Python就可以制作的简单词云
2021/06/07 Python
动画电影《擅长捉弄人的高木同学》6月10日上映!
2022/03/20 日漫
MySQL中order by的执行过程
2022/06/05 MySQL