7.2 Angular中的缓存
7.2.1 $cacheFactory服务创建缓存对象
$cacheFactory(key,[options]) //key:缓存对象名称 [options]一般是数字，缓存前几次请求
方法
|-- info //cache.info() 返回缓存对象名称、大小
|-- put //cache.put("User","user") 向缓存对象以key/value形式加入缓存内容
|-- get //cache.get("User") 获得value值
|-- remove //cache.remove("User") 移出指定缓存
|-- removeAll //移出全部缓存，重置缓存结构
|-- destory //从$cacheFactory缓存注册中删除所有缓存条目，重置缓存对象
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>7.2.1 $cacheFactory服务创建缓存对象</title>
</head>
<body>
<div ng-app="myapp" ng-controller="contro">
<input type="text" ng-model="name">
<button ng-click="set()">设置</button>
<button ng-click="show()">显示</button>
<button ng-click="del()">删除</button>
<div>缓存值：{{value}}</div>
</div>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
angular.module("myapp",[])
.service("cache",function($cacheFactory){ //创建服务cache，返回名为test的缓存对象
return $cacheFactory("test");
})
.controller("contro",function($scope,cache){ //注入服务
$scope.set = function(){
cache.put("mycache",$scope.name);
}
$scope.show = function(){
var cac = cache.get("mycache");
$scope.value = cac ? cac : "空值";
}
$scope.del = function(){
cache.remove("mycache")
}
})
</script>
</body>
</html>
7.2.3 自定义$http服务中的缓存
<%@page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>7.2.3 自定义$http服务中的缓存</title>
</head>
<body>
<div ng-app="myapp" ng-controller="contro">
<div>返回的用户名：{{result}}</div>
<button ng-click="refresh()">刷新</button>
</div>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
angular.module("myapp",[])
.service("cache",function($cacheFactory){ //创建服务cache，返回名为mycache的缓存实例，最大容量为3次
return $cacheFactory("mycache",{capacity:3})
})
.controller("contro",function($scope,$http,cache){ //注入服务cache
$http({
method:'post',
url:'/loadUser',
cache:cache
})
.success(function(data,status,headers,config){
alert(1);
$scope.result = data;
cache.put("user",data);
})
$scope.refresh = function(){
var user = cache.get("user");
$scope.result = user ? user+"(来源缓存)" : "刷新失败！"
}
})
</script>
</body>
</html>