详解Angular中$cacheFactory缓存的使用
更新时间：2016年08月19日 09:31:22 作者：薛陈磊
这篇文章主要介绍了Angular中$cacheFactory缓存的使用,非常不错，具有参考借鉴价值，需要的朋友可以参考下
最近在学习使用angular,慢慢从jquery ui转型到用ng开发，发现了很多不同点，继续学习吧；
首先创建一个服务，以便在项目中的controller中引用，服务有几种存在形式，factory();service();constant();value();provider();其中provider是最基础的，其他服务都是基于这个写的，具体区别这里就不展开了，大家可以看看源码；服务是各个controller之间通话的重要形式，在实际项目中会用的很多，下面是代码：
angular.module('yourApp').factory('myCache',function($cacheFactory){
return $cacheFactory('myData');
});
这里‘myCache'是服务名称，且是唯一，针对一个特定的缓存对象，存在于浏览器中，供控制器引用：
angular.module('yourApp').
controller('userCtrl',['$scope','$http','myCache',function($scope,$http,myCache){ //监测是否已经存在缓存数据，如果有就获取然后该干嘛干嘛去
var cache=myCache.get('myData');
if(cache){
$scope.variable=cache;
}else{
//从接口获取数据，put到缓存中
var jurl='/data/getdata';
$http({
url: jurl,
method: "GET",
data: "{'query':'somevalue'}",
headers: { 'Content-Type': 'application/json' }
}).success(function (data, status, headers, config) {
//something in success
}).error(function (data, status, headers, config) {
//something in error
});
}
}])
页面第一次打开时，会从接口中获取数据，当页面发生路由跳转时，这些数据是一直被缓存的，路由跳转到有需求的页面，监测到已经被缓存，就不用向服务器请求数据了，如果是页面被关闭或者是刷新了页面，缓存会丢失，重新向、请求数据并缓存；
这是个简单的示例，在实际项目中的数据会复杂些，比如为了页面优化减少而将页面数据集合请求，减少数据请求次数，获取到数据后分配的route的各个template中，数据结构会复杂些；
目前还没有缓存比较大的数据的示例，理论上这里的cache是javascript中的一个object对象，所以应用中cache的大小限制或大小对浏览器页面性能的影响，还不是很清楚，继续深扒，发现了不同点再来续更。
以上所述是小编给大家介绍的详解Angular中$cacheFactory缓存的使用，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
本文主要讲解AngularJS ng-switch 指令,这里对ng-switch 指令的基础资料做了详细整理，并附代码示例，有兴趣的小伙伴可以参考下2016-08-08
这篇文章主要介绍了AngularJS 单元测试（一）详解的相关资料,需要的朋友可以参考下2016-09-09
本篇文章主要介绍了Angular之toDoList的实现代码示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-12-12
这篇文章主要介绍了Angular4学习笔记之准备和环境搭建项目，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
这篇文章主要介绍了详解angular2如何手动点击特定元素上的点击事件，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-10-10
本篇文章主要介绍angular+bootstrap的双向数据绑定的实例，具有很好的参考价值。下面跟着小编一起来看下吧2017-03-03
Angular 4.x中表单Reactive Forms详解
这篇文章主要介绍了Angular 4.x中表单Reactive Forms的相关资料，文中通过示例代码介绍的非常详细，相信对大家具有一定的参考价值，需要的朋友们下面来一起看看吧。2017-04-04
本篇文章主要介绍了详解Angular2组件之间如何通信，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-06-06
本文主要介绍了AngularJS ng-if 指令,在这里整理了一些ng-if 指令的基础资料,并有实例代码,有需要的同学可以参考下2016-08-08
这篇文章主要给大家介绍了angular.JS实现网页禁用调试、复制和剪切的相关资料，文中介绍的非常详细，相信对大家具有一定的参考价值，需要的朋友们下面来一起看看吧。2017-03-03
最新评论