tpl是witrix开发平台中的动态xml标签技术,其基本特点表现为如下三个方面:
1. 执行能力
xml本身只是对数据的描述,而没有循环和判断的能力。
在tpl中<c:forEach>和<c:if>标签可以完成程序语言的执行功能,并定义了<c:tile>, <c:iif>等更方便的标签。
2. 抽象能力
获得抽象能力,首要的一点是使得创建新概念的成本极低。很少有人大量开发jsp tag,原因就是开发tag过于麻烦,而且调整不方便。另外开发出的tag如果粒度太小,大量使用的时候是对性能的致命伤害。
tpl首先需要经过编译,而不是象jsp tag那样完全动态运行,而且tpl编译出的结果是无状态的,因此解决了性能上的问题。
在tpl中导入外部模板的语法非常简单,可以实现基本的分解
<c:include src="xxx.tpl" />
更重要的是,tpl中定义了完善的库机制。
使用库
<!-- 导入外部包, 导入时指定名字空间为demo。
注意tpl中并没有完整的名字空间支持,只能作为qName使用
-->
<c:lib src="demo_lib.xml" namespace="demo" />
<!-- 对具有cache:timeout属性的节点应用cache修饰,即该节点的运行内容被缓存 -->
<c:decorator type="cache" match="//@[cache:timeout]" />
<div id="blockA">
<p>通过tpl:tag属性可以设定宿主标签的真实标签名。这种做法可以方便可视化设计:</p>
<input tpl:tag="demo:文本框" value="in block A"
otherValue="${varInJsp}" onclick="clickOnBtn()"/>
</div>
<div id="blockB">
<p>分页表格:</p>
<img tpl:tag="demo:分页表格" headers="fieldA,fieldB" pager="${pager}" />
</div>
<div id="blockC">
<p>bodyTag标签的调用:</p>
<demo:循环data>
<input type="text" value="${row}" /> <br/>
</demo:循环data>
</div>
<div id="blockD" cache:timeout="1000s" >
<p>条件标签的调用:</p>
<demo:当Num足够大>
<p>当 thisObj中的变量 'num' 的值大于3的时候显示这句话 </p>
</demo:当Num足够大>
</div>
定义库文件demo_lib.xml
<!--
自定义标签的属性:
type: simpleTag, bodyTag 或者 conditionTag, 缺省为simpleTag
importVars : 每个自定义标签具有自己的变量空间,需要通过importVars来明确指定从外部变量空间中导入的变量。
demandArgs: 调用时必须明确给出这些参数的值
otherArgs: 如果指定了该参数,则调用自定义标签时能够使用的参数就必须在demandArgs和otherArgs指定的范围之内。
-->
<demo>
<!-- 一个简单的tag示例, 直接输出变量。这里demandArgs指定调用时必须提供的变量。 -->
<文本框 demandArgs="value" otherArgs="otherValue,onclick" type="simpleTag" >
<p> ----------------------------------- </p>
<!-- 可以使用调用时提供的其他变量,如otherValue-->
<input size="40" type="text" value="${value} * ${otherValue}" onclick="${onclick}"/>
<p> -----------------------------------</p>
</文本框>
<!-- 一个自动分页表格,要求传入headers(List类型)指定表头,pager(Pager类型)提供数据 -->
<分页表格 demandArgs="headers,pager">
<!-- 从外部导入tpl文件 -->
<c:include src="flex_table.tpl" />
</分页表格>
<!-- 一个bodyTag示例: 循环处理thisObj中的变量data中的每一行。
importVars从调用环境中自动导入变量而不需要通过调用参数直接指定。
当然如果调用参数中指定的变量与importVars中指定的变量重复,则调用参数会覆盖importVars.
-->
<循环data importVars="thisObj" type="bodyTag">
<c:forEach var="row" items="${data}">
<!-- tagBody为调用时标签的内容 -->
<cp:compile src="${tagBody}" />
</c:forEach>
</循环data>
<!-- 一个条件标签的示例.
条件标签一般不应该输出文本,而是返回一个bool值。仅当返回true的时候,调用时标签的内容才会被运行。
-->
<当Num足够大 importVars="thisObj" type="conditionTag">
<l:gt name="num" value="3" />
</当Num足够大>
</demo>
注
意到bodyTag和conditionTag使得我们可以将循环(容器)逻辑和判断逻辑抽象成有意义的概念,而不再是一些执行的指令。这种抽象能力的应
用非常依赖于xml的自描述特性,我们不需要付出太大的努力,就可以在lib中封装出一个有意义的概念来!
而且tag的参数可以指定,可以缺省,存在多种选择,也对应着多种逻辑模型。
通过<c:decorator>的用法可以看到,因为xml明确定义了结构,使得我们可以轻易的实施类似AOP的功能。
3. 集成能力
首先,tpl完全符合xml规范,与xml世界接轨,可以自由的使用xslt。例如,在
任何标签中都可以指定tpl:xdecorator属性, tpl在编译之前首先会应用指定的xslt文件进行变换,对变换后的结果再进行编译。
<anyTagName tpl:xdecorator="some_xslt.xslt">
...
</anyTagName>
其次,tpl可以使用属性标记,即tpl标签不仅仅可以通过标签名来标识,而且可以通过tpl:tag属性来标识。例如:
<input tpl:decorator="demo:文本框" />
与 <demo:文本框 />等效。
这种做法避免了tpl侵入html模型,使得我们可以利用现有工具对tpl进行所见即所得(WISIWIG)的设计。
再次, 在tpl中使用EL(Expression Language)语言,集成java数据模型。
第四, 在tpl中可以采用如下方式实现强类型化,完成与java的接口。
interface ITest{
void test(String name, int value);
}
<o:class name="MyClass" implements="ITest">
<test args="name,value" >
...
</test>
</o:class>
这种能力可以在数据源的filter中使用。
第五, tpl可以轻易的集成其它xml技术。例如,tpl集成了ant
<ant:run>
<echo message="xxx" />
</ant:run>
因此,我们立刻拥有了ant的数千个功能标签。
分享到:
相关推荐
#将html模板转化为javascript模块 ##目的 减轻前端拼接大量HTML以及维护时候的困难程度 ##安装 安装node,参见: 安装npm,参见: 安装tpl npm方式: $ npm install tpl2js -g 源码方式: $ cd ~ $ git clone git...
它使用将模板转换为 javascript。特征更有力设置Tpl 取决于 。 有一种安装 Node.js 的好方法,您可以访问了解更多详细信息。 以下Tpl设置在 Tpl/Tpl.sublime-settings 中可用(默认如下所示)。有我的 nodejs 和 tpl...
TPL:任务,TPL,PLINQ
Yangon-tpl:仰光模板
(未发布,仅在进行中) 模板实验。 React。 function App ( props ) { // some suspense calls, hooks, whatever let count = visitors . read ( ) ; return tpl ` <style> h1 { color:red; } <...
shopnc开发技术文档
有关tpl的文档,请访问:
tpl 基于字符串的模版引擎 用法 let tpl = ` 小明是个老师,他的名字叫做{{name}}, 今年{{year}}岁。 他有学生{{student.length}}个。 {{#student}} 学生 ==> {{name}} <span>{{#girls}} 年龄: {{age}} ...
a06-tpl 快速初始化你的项目模版可以快速初始化你的项目模版,目前支持单页,和js库两种模版,后续会增加多页模版的支持安装npm install a06-tpl -g执行// 以xxx为项目名称初始化单页模版,也可以不输出项目名$ a06-tpl ...
下划线 underscore-tpl是一个插件,用于加载和预编译模板。 以下是一些,这些显示了渲染预编译模板时的区别。 用法 使用tpl! 加载模板时的前缀。... 该插件将在requirejs r.js优化器之后编译模板。 而且在开
3ds-tpl:用C开发3DS游戏和应用程序的模板
Hyla_Tpl 基于 phplib 的 tpl 引擎的 PHP tpl 引擎。 法语的所有文档和示例都在这里: :
生成器-简单-npm-tpl一个生成指定npm包目录结构的generator安装首先,使用安装和generator-easy-npm-tpl(我们假设您已经预装了 )。 npm install -g yonpm install -g generator-easy-npm-tpl 然后生成您的新项目:...
tpl: { wrap: ' class="dropify-wrapper"></div>', message: ' class="dropify-message"> class="file-icon" /> <p>{{ default }}</p></div>', preview: ' class="dropify-preview"> class=...
vue-element-admin-tpl 基于Vue和Element-UI管理平台模板。 项目演示 1, 用户名:admin,密码:123456 项目设置 yarn install 编译和热重装以进行开发 yarn run dev 编译并最小化生产 yarn run build 运行测试 ...
及时上手,不用其他配置即可进行业务开发。 提供前端 mock server,真正实现前后端分离 自动提供 eslint 检查 打包自动优化 install nodejs install yarn install project node packages install by yarn or npm ...
act-tpl目录结构css:存放面使用的到的css样式文件images:存放页面使用到的媒体文件js:存放页面使用到的js文件scss:CSS预处理文件index.html:静态文件
vue-cli3-tpl 项目描述 基于vue-cli3脚手架建造的项目模板 项目设置 npm install 编译和热重装以进行开发 npm run serve 编译并最小化生产 npm run build 运行测试 npm run test 整理和修复文件 npm run lint 运行...
然后它将字段名称与字段设置文件进行比较,以便为 tpl 文件中的字段创建字段感知标记。 例如。 如果您有一个图像字段,它将用标签而不是包装它 它将在您目录的根目录中创建这些文件,然后您可以将其复制到相应的...
leya-tpl 异步加载和转换模板。 var tpl = require('leya-tpl'); tpl.loadTransform({ file: 'test', data: { test: { scope: this, fn: method } }, done: function(err, text) { } });