AngularJS的指令中经常定义模板(template或templateUrl),可以选择将Html模板直接寄宿在WEB容器中,如Tomcat、IIS、Nginx、NodeJs Express,也可以选择ngTemplate模式,将Html模板放在view的page上,或直接将所有模板打包成一个javascript和应用的javascript合并成一个javascript文件一起发布。

  对于ngTemplate寄宿模式,ngTemplate模板,可以在页面中这样定义

  <script type="text/ng-template" id="/tpl.html">

    Content of the template

  </script>

  其会在编译compile阶段被Angular解析,并放在$templateCache模板缓存服务中。这是Angular内置的script标签,它会在compile阶段遍历所有script标签,当script类型为text/ng-template时候,会将其内容存放在$templateCache模板缓存服务中,供其他的directie、route、ng-inclue使用。

  $templateCache模板缓存服务,是为了对Html模板进行缓存而创建的服务,Angular在发送Html模板加载请求前,首先会从$templateCache缓存中查找是否有与所请求的URL对应的模板数据,如下

  $templateCache.get('templateId.html')

  如果找到了,就用缓存中的HTML模板,而不再发送Ajax请求去获取Html模板。

  另外,对于所有指定和模板AngularJS是默认开启。

  SPA,就是把View的显示处理等表现层逻辑都推到前端,而后端只提供只与数据和业务相关的RESTful API,这样对于一个应用程序来说,用来处理数据的业务逻辑可以被多个客户应用所使用,可以被浏览器为主的Web应用所使用,也可以被winform为主的桌面GUI程序所使用,也可以被移动APP客户端程序所使用,数据和业务等核心逻辑是可以被共享和复用的,将View的逻辑分开,留给不同场景的客户端分别实现,这将是更好的解决方案。

  对于一个应用程序View逻辑的分离,HTML、Javascript、Css这类静态资源,是不会发生变化的,可以自由缓存在客户端,这样可以减少服务端交互,为了进一步提升性能,我们可以把这类静态资源分离部署,利用Nginx等反向代理服务器或CDN服务,让我们的应用程序获得更好的响应速度与延展性。

  编译的示意代码:

  

AngularJS ngTemplate寄宿方式 模板缓存 $templateCache的更多相关文章

  1. ng-template寄宿方式

    如果你是一个angular的开发者的话,对于ng-html2js你应该 很熟悉.对于angular的指令,我们经常需要定义模板( directive template/templateUrl),你可以 ...

  2. (转)WCF开发框架形成之旅---WCF的几种寄宿方式

    WCF寄宿方式是一种非常灵活的操作,可以在IIS服务.Windows服务.Winform程序.控制台程序中进行寄宿,从而实现WCF服务的运行,为调用者方便.高效提供服务调用.本文分别对这几种方式进行详 ...

  3. WCF寄宿方式

    WCF开发框架形成之旅---WCF的几种寄宿方式 WCF寄宿方式是一种非常灵活的操作,可以在IIS服务.Windows服务.Winform程序.控制台程序中进行寄宿,从而实现WCF服务的运行,为调用者 ...

  4. WCF开发框架形成之旅---WCF的几种寄宿方式

    WCF开发框架形成之旅---WCF的几种寄宿方式 WCF寄宿方式是一种非常灵活的操作,可以在IIS服务.Windows服务.Winform程序.控制台程序中进行寄宿,从而实现WCF服务的运行,为调用者 ...

  5. 微软 WCF的几种寄宿方式,寄宿IIS、寄宿winform、寄宿控制台、寄宿Windows服务

    WCF寄宿方式是一种非常灵活的操作,可以在IIS服务.Windows服务.Winform程序.控制台程序中进行寄宿,从而实现WCF服务的运行,为调用者方便.高效提供服务调用.本文分别对这几种方式进行详 ...

  6. [转]WCF的几种寄宿方式

    转自:WCF开发框架形成之旅---WCF的几种寄宿方式 WCF寄宿方式是一种非常灵活的操作,可以在IIS服务.Windows服务.Winform程序.控制台程序中进行寄宿,从而实现WCF服务的运行,为 ...

  7. WCF :IIS寄宿方式的Web地址、BaseAddress和EndPoint Address的关系

    对于在IIS中通过W3SVC或WAS寄宿的WCF Service,其在浏览器中显示的地址(Web地址),与其配置文件中的BaseAddress和EndPoint Address有什么关系呢?让我们来分 ...

  8. ASP.NET Web API 入门 (API接口、寄宿方式、HttpClient调用)

    一.ASP.NET Web API接口定义 ASP.NET Web API默认实现了Action方法和HTTP方法的映射,Action方法方法名体现了其能处理的请求必须采用的HTTP方法 二.寄宿方式 ...

  9. AngularJs $templateCache 和 $templateRequest 模板缓存

    $templateCache 第一次使用模板,它被加载到模板缓存中,以便快速检索.你可以直接将模板标签加载到缓存中,或者通过$templateCache服务. 通过script标签: <scri ...

随机推荐

  1. gulp ( http://markpop.github.io/2014/09/17/Gulp入门教程 )

    前言 最近流行前端构建工具,苦于之前使用Grunt,代码很难阅读,现在出了Gulp,真是摆脱了痛苦.发现了一篇很好的Gulp英文教程,整理翻译给大家看看. 为什么使用Gulp Gulp基于Node.j ...

  2. win10安装.net3.5

    近日有网友反映在windows10_64位系统电脑上安装Net framework3.5,操作时总失败,怎么办呢?小编下面就介绍win10 64位系统无法安装Net framework3.5的两种解决 ...

  3. 错误:在非结构或联合中请求成员‘next’

    #include <stdio.h> #include <stdlib.h> #define ElemType int #define Status int #define O ...

  4. “Interrupted by header callback: Server reports Content-Length”如何解决

    mock初始化时的错误信息如下: Downloading Packages: [SKIPPED] systemd--.fc25.x86_64.rpm: Already downloaded [SKIP ...

  5. Git 分支 主干

    ~/Desktop/work/movies/movie(apps) $ git status  //先查看是否有需要提交的东西# On branch appsnothing to commit (wo ...

  6. nodejs 数字字节转换操作

    function number2Bytes(i) { var arr = new Int32Array(1); arr[0] = 0; var buf = Buffer.from(arr.buffer ...

  7. Virtual Machine Kernel Panic : Not Syncing : VFS : Unable To Mount Root FS On Unknown-Block (0,0)

    Virtual Machine Kernel Panic : Not Syncing : VFS : Unable To Mount Root FS On Unknown-Block (0,0) 33 ...

  8. maven3 学习

    主要参考博文:http://www.cnblogs.com/yjmyzz/p/3495762.html 修正: 1.下载maven 3.1.1 先到官网http://maven.apache.org/ ...

  9. tomcat+bean例子

    C:\Program Files\Apache Software Foundation\Tomcat 7.0\webapps\app\WEB-INF\classes\文件夹下 建立beanTestPa ...

  10. 解决maven update project 后项目jdk变成1.5的问题

    一.问题描述 在Eclipse中新建了一个Maven工程, 然后更改JDK版本为1.7, 结果每次使用Maven > Update project的时候JDK版本都恢复成1.5. 二.原因分析 ...