angular模板加载 ----ng-template

Angularjs作为mvc（或者说mvvm)框架，同样具备模板这一基本概念。

NG加载模板的顺序为内存加载---AJAX加载。

内存加载

如果之前使用过Bootstrap 插件的ng版，即angular-ui，就会了解到这种方式的具体应用。模板本质上是字符串，把字符串直接写入内存，加载时直接从内存获取，速度会更快，有两种方式显式启用内存加载。

通过使用$templateCache service来实现

angular.module('myApp', [])
  .controller('myCtrl', ['$scope','$templateCache', function($scope,$templateCache){
       var tmp = '<h4>lovestory</h4>'
             + '<p>这是直接调用$templateCache服务获取模板文件的方式</p>'
             + '<a href="http://www.baidu.com">服务启用templateCache方式</a>';
       $templateCache.put('lovestory.html',tmp);                
   }])

<script type="text/ng-template" id="lovestory.html">
    <h4>lovestory</h4>
    <p>这是script标签获取模板文件的方式</p>
    <a href="http://www.baidu.com">标签启用templateCache方式</a>
</script>

这里需要注意，type="text/ng-template"是指明这是ng模板，id属性是指实际使用模板时的一个引用，标签之间的内容才是实际的模板内容。而且，需要注意，id绝对不是URL，这个script标签绝对不会发出HTTP请求，具体讨论见最后。
实际应用模板时候，使用ID属性，即可从内存中获取对应数据。

<div ng-include="'lovestory.html'" class="well"></div>