详解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 相关文章推荐
漂亮的仿flash菜单,来自蓝色经典
Jun 26 Javascript
dtree 网页树状菜单及传递对象集合到js内,动态生成节点
Apr 14 Javascript
jquery 隐藏与显示tr标签示例代码
Jun 06 Javascript
实现音乐播放器的代码(html5+css3+jquery)
Aug 04 Javascript
每日十条JavaScript经验技巧(二)
Jun 23 Javascript
BootStrap 图片样式、辅助类样式和CSS组件的实例详解
Jan 20 Javascript
利用Javascript获取选择文本所在的句子详解
Dec 03 Javascript
vue2.0 自定义 饼状图 (Echarts)组件的方法
Mar 02 Javascript
js实现轮播图的完整代码
Oct 26 Javascript
vue获取时间戳转换为日期格式代码实例
Apr 17 Javascript
微信小程序 bindtap 传参的实例代码
Feb 21 Javascript
vue项目实现减少app.js和vender.js的体积操作
Nov 12 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
fleaphp rolesNameField bug解决方法
2011/04/23 PHP
PHP表单验证的3个函数ISSET()、empty()、is_numeric()的使用方法
2011/08/22 PHP
PHP实现正则表达式分组捕获操作示例
2018/02/03 PHP
用JSON做数据传输格式中的一些问题总结
2011/12/21 Javascript
幻灯片带网页设计中的20个奇妙应用示例小结
2012/05/27 Javascript
js验证模型自我实现的具体方法
2013/06/21 Javascript
JavaScript基本语法讲解
2015/06/03 Javascript
gulp-uglify 与gulp.watch()配合使用时报错(重复压缩问题)
2016/08/24 Javascript
jQuery simpleModal插件的使用介绍
2016/08/30 Javascript
详解jQuery选择器
2016/12/21 Javascript
jQuery日程管理控件glDatePicker用法详解
2017/03/29 jQuery
JS在if中的强制类型转换方式
2018/07/15 Javascript
jQuery实现的点击按钮改变样式功能示例
2018/07/21 jQuery
webpack 开发和生产并行设置的方法
2018/11/08 Javascript
JS实现将对象转化为数组的方法分析
2019/01/21 Javascript
Vue 实例事件简单示例
2019/09/19 Javascript
在Python中使用matplotlib模块绘制数据图的示例
2015/05/04 Python
再谈Python中的字符串与字符编码(推荐)
2016/12/14 Python
python深度优先搜索和广度优先搜索
2018/02/07 Python
Python qqbot 实现qq机器人的示例代码
2019/07/11 Python
找Python安装目录,设置环境路径以及在命令行运行python脚本实例
2020/03/09 Python
解决python多线程报错:AttributeError: Can't pickle local object问题
2020/04/08 Python
Nginx+Uwsgi+Django 项目部署到服务器的思路详解
2020/05/08 Python
CSS3模拟动画下拉菜单效果
2017/04/12 HTML / CSS
解决html5中的video标签ios系统中无法播放使用的问题
2020/08/10 HTML / CSS
AVI-8手表美国官方商店:AVI-8 USA
2019/04/10 全球购物
美国椅子和沙发制造商:La-Z-Boy
2020/10/25 全球购物
库房主管岗位职责
2013/12/31 职场文书
小学生考试获奖感言
2014/01/30 职场文书
擅自离岗检讨书
2014/02/11 职场文书
幼儿园大班见习报告
2014/10/31 职场文书
2015年保洁员工作总结
2015/05/04 职场文书
理想国读书笔记
2015/06/25 职场文书
党性修养心得体会2016
2016/01/21 职场文书
SQL Server中使用表变量和临时表
2022/05/20 SQL Server
python pandas 解析(读取、写入)CSV 文件的操作方法
2022/12/24 Python