AngularJS指令之$templateCache

当我们编写的模板,不仅仅在一个指令中使用,也需要在其他的指令中使用,我们希望AngularJS帮我们把它给缓存起来.就可以使用$templateCache了。先看代码:

html:

<!doctype html>
<html ng-app="MyModule">
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <hello></hello>
    </body>
    <script src="framework/angular-1.3.0.14/angular.js"><//script>
    <script src="$templateCache.js"><//script>
</html>

js:

var myModule = angular.module("MyModule", []);

//注射器加载完所有模块时,此方法执行一次
myModule.run(function($templateCache){
    $templateCache.put("hello.html","<div>Hello everyone!!!!!!</div>");
});

myModule.directive("hello", function($templateCache) {
    return {
        restrict: 'AECM',
        template: $templateCache.get("hello.html"),
        replace: true
    }
});

run方法解释

当我们的注射器,加载完了所有的模块之后,run方法将会被执行一次。

总结

  1. 使用$templateCache.put把模板缓存起来
  2. 其他指令使用$templateCache.get就可以获取到了。

通过这种方式,就可以把模板缓存起来,被多个指令使用它。

nginclude也可以实现此功能。







发表于: 21天前   最后更新时间: 21天前   游览量:60
上一条: AngularJS之指令
下一条: AngularJS指令之replace和transclude

评论…


  • 评论…
    • in this conversation