引入模板引擎

作者: 云香水识 | 来源:发表于2014-12-26 20:41 被阅读211次

从这篇文章开始, 我们每篇开始前,先需要下载上次完成的版本。

开始前

如果没有下载之前的代码,可以使用 $npm install http-f2e-server@0.0.4 先安装上一篇完成的版本。

服务端脚本嵌入

上篇完成了模板引用和包含功能,其中include在ASP,JSP,PHP这样的脚本中都有类似功能, 事实上各种服务端脚本最基本的功能是一个嵌入式服务端代码的模式, 例如php的 <?php?>,以及ASP和JSP使用的 <% %>

underscore.js模板

  • underscore http://underscorejs.org
  • 因为 underscore.template 相对简单纯粹,我选用它作为f2e-server的默认模板引擎, 后面一些内置页面都将使用这个模板开发, 如果感兴趣您可以尝试其他模板引擎如: jade
  • API:
var compiled = _.template("hello: <%= name %>");
compiled({name: 'moe'});
=> "hello: moe"

安装underscore

直接在根目录使用 $npm install underscore 就能安装underscore

植入功能

修改handle.js 模块中的execute方法, 返回str前进行template包装

var compiled = _.template(str);
return compiled({require: require});
  • 测试源代码
<ul id="each-list">
<%for(var i=0; i < 6; i++){
    print( '<li>模板循环项'+(i+1)+'</li>\n' );
}%>
</ul>
  • 输出结果代码
<ul id="each-list">
<li>模板循环项1</li>
<li>模板循环项2</li>
<li>模板循环项3</li>
<li>模板循环项4</li>
<li>模板循环项5</li>
<li>模板循环项6</li>
</ul>

PS:

本次开发代码没有发布仓库版本,相关代码跟随下一篇共同发布到0.0.6版本。

相关文章

  • 引入模板引擎

    从这篇文章开始, 我们每篇开始前,先需要下载上次完成的版本。 开始前 如果没有下载之前的代码,可以使用 $npm ...

  • springboot的web入门

    springboot的默认只支持html需要引入模板引擎模板引擎:如jsp这样,springboot推荐使用thy...

  • springboot集成webSocket实现网络实时通讯

    1.引入依赖 1.1 引入websocket依赖1.2 引入thymeleaf模板引擎依赖 2.webSocket...

  • 004 以太坊钱包开发-创建用户

    安装模板引擎 引入模版引擎 修改 myWallet/index.js,加载模版引擎 新建 view 页面 进入项目...

  • 引入模板引擎thymeleaf

    1、pom.xml 注入模板引擎thymeleaf依赖,切换thymeleaf版本为3.0 2、thymeleaf...

  • JavaScript---模版引擎

    模版引擎 使用步骤:引入模板引擎从服务器获取数据编写模板相关的代码 注意点: 模板相关的代码必须放到获取数据之前

  • springboot集成shiro前的工作

    由于要跳转页面,我这里使用thymleaf模板 引入了Spirng Boot对thymleaf模板引擎的依赖。版本...

  • Express学习笔记

    安装 Handlebars模板引擎 安装 在express中引入 默认是使用main模板 如果不想使用布局: 如果...

  • template模板引擎的使用

    1)模板引擎的引入 2)模板的书写: 将模板写在此script标签中,通过id将模板与js连接 3)表达式 使用{...

  • SpringBoot学习笔记(三)

    SpringBoot整合模板引擎 整合freemarker整合thymeleaf 引入相关依赖 参数配置 @Map...

网友评论

    本文标题:引入模板引擎

    本文链接:https://www.haomeiwen.com/subject/wbiatttx.html