模板缓存-$templateCache and 缓存工厂 $cacheFactory


1.使用script标签

<html ng-app>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.js"></script>
<body>
<div ng-include='"test"'></div>
<script type="text/ng-template" id="test">
This is the content of the template
</script>
</body>
</html>
  • 如果使用script标签,那么就要加上type为text/ng-template

  • ng-include的值必须用'""'或者"''",只有一个单引号或者双引号的时候会无效

2.使用url地址文件

<html ng-app>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.js"></script>
<body>
<div ng-include='"test.html"'></div>
</body>
</html>
  • 在目录下新建test.html文件即可

3.使用js脚本

<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.js"></script>
<body>
<div ng-include='"test"'></div>
<script>
angular.module('app.ui', [])
.run(['$templateCache','$cacheFactory',
function($templateCache,$cacheFactory) {
var cachetest = $cacheFactory('cache');
cachetest.put('a','This is the content of the template');
}]);
angular.module('app', ['app.ui'])
.run(['$templateCache','$cacheFactory',
function(temp,cache) {
var cachetest = cache.get('cache');
temp.put('test',cachetest.get('a') );
cachetest.destroy();
}]);
angular.bootstrap(document, ['app']);
</script>
</body>
</html>

$templateCache里面存放的是键值对的数据,有$cacheFactory创建对象一样的方法

$cacheFactory创建的的对象,有如下方法

  1. {object} info() — 返回大小、id、一些缓存的参数
  2. {value} put(key,value) — 插入键值对,键为字符串,值为任何类型,返回键值对中的值
  3. {value} get(key) —通过键返回值,如果不存在返回 undefined
  4. {void} remove(key) — 通过键来移除,无返回值
  5. {void} removeAll() — 移除所有的模板缓存,无返回值
  6. {void} destroy() —移除当前创建的缓存($templateCache无效)

$cacheFactory有所创建的对象直接通过$cacheFactory('cacheID',[,option])

其中的option对象主要有capacity参数为数字类型设置最大的列表长度,
默认值为Number.MAX_VALUE,当超过的时候最早的会被移除,当设置最长长度为2的时候,
方法如下

  $cacheFactory('cache',{capacity:2});

获取的时候调用get方法参数为cache的ID即可,当不存在时返回undefined


Ⅱ.AngularJS的点点滴滴--缓存的更多相关文章

  1. Ⅲ.AngularJS的点点滴滴-- 路由

    路由ngRoute (需要依赖ngRoute模块) <html> <script src="http://ajax.googleapis.com/ajax/libs/ang ...

  2. Ⅰ.AngularJS的点点滴滴--引导

    AngularJS已经被很多人像炒冷饭一样炒过啦,大部分都是直接复制官方文档没有说明一些注意事项,不过什么都要从头开始吧 页面引导实例化 1.自动实例化 <html> <script ...

  3. Ⅶ.AngularJS的点点滴滴-- 事件

    事件(和js一样有冒泡和捕获) <html> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2 ...

  4. Ⅵ.AngularJS的点点滴滴-- 指令

    指令 基本用法 <html> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angul ...

  5. Ⅴ.AngularJS的点点滴滴-- 资源和过滤

    资源ngResource(依赖ngResource模块) <html> <script src="http://ajax.googleapis.com/ajax/libs/ ...

  6. Ⅳ.AngularJS的点点滴滴-- 服务

    服务(Angularjs很多方法都是服务组成的) 1.使用service方法创建的单例服务 <html> <script src="http://ajax.googleap ...

  7. Angularjs中的缓存以及缓存清理

    写在最前面:这篇博文是2篇文章组成,详细介绍了Angularjs中的缓存以及缓存清理,文章由上海尚学堂转载过来,欢迎大家阅读和评论.转载请注明出处,谢谢! 一个缓存就是一个组件,它可以透明地储存数据, ...

  8. AngularJs 禁止模板缓存

    因为AngularJs的特性(or 浏览器本身的缓存?),angular默认的HTML模板加载都会被缓存起来.导致每次修改完模板之后都得经常需要清除浏览器的缓存来保证浏览器去获得最新的html模板,自 ...

  9. AngularJS中的缓存

    欢迎大家指导与讨论 : ) 缓存篇 一个缓存就是一个组件,它可以透明地储存数据,以便以后可以更快地服务于请求.多次重复地获取资源可能会导致数据重复,消耗时间.因此缓存适用于变化性不大的一些数据,缓存能 ...

随机推荐

  1. 配置PhpStorm调试PHP

    配置PhpStorm调试PHP 第一步:配置 XDebug 下载安装XDebug到本地环境(参考:Zend Studio 9.x + xampp + XDebug 调试环境安装详解),打开php.in ...

  2. FFMPEG-数据结构解释(AVCodecContext,AVStream,AVFormatContext)

    http://blog.csdn.net/yuan892173701/article/details/8702333 AVCodecContext  这是一个描述编解码器上下文的数据结构,包含了众多编 ...

  3. [转贴]JAVA 百度地图SDK地图学习——实现定位功能

    之前已经完成了百度地图SDK和百度定位SDK的配置. http://my.oschina.net/u/1051634/blog/180880 实现百度定位的功能,最好仔细看看官方的文档,看了好几次才有 ...

  4. [转贴]JAVA :CXF 简介

    Apache CXF = Celtix + XFire,Apache CXF 的前身叫 Apache CeltiXfire,现在已经正式更名为 Apache CXF 了,以下简称为 CXF.CXF 继 ...

  5. 最全的微软msdn原版windows系统镜像和office下载地址集锦

    随着windows的发展,越来越多的人都热衷于微软的原版系统下载了,相比之前的版本比如winxp版本,windows vista/win7/win8/win8.1/win10后来的版本在安装方面也比较 ...

  6. 心愿:做一个精简版MFC

    我觉得自己有能力看懂MFC的C++代码和总体流程,但是由于MFC混杂了太多的东西,比如OLE等等不必要的东西,又做了无数的ASSERT判断,影响整体流程的理解.因此我要做一个精简版的MFC,而且能用它 ...

  7. JAVA 抛出与声明异常

    在编程过程中,我们往往会遇到这种情况,在当前环境中无法解决,比如用户传入的参数错误,IO设备问题等.此时,就要从当前环境中抛出异常提交给上级来处理. 在JAVA语言中,使用throw关键字来抛出异常. ...

  8. 例说C#深拷贝与浅拷贝

    一开始,先对C#深拷贝与浅拷贝知识做个简单的总结. 无论是浅拷贝与深拷贝,C#都将源对象中的所有字段复制到新的对象中.不过,对于值类型字段,引用类型字段以及字符串类型字段的处理,两种拷贝方式存在一定的 ...

  9. SharePoint 2010中使用SPListItemCollectionPosition更快的结果

    转:http://www.16kan.com/article/detail/318657.html Introduction介绍 In this article we will explore the ...

  10. 关于ArrayList线程安全解决方案

    一:使用synchronized关键字 二:使用Collections.synchronizedList();使用方法如下: 假如你创建的代码如下:List<Map<String,Obje ...