VTemplate模板引擎的使用 - MasterPage篇
2009-12-10 13:19
525 查看
table {border-left:1px dotted #336633;border-top:1px dotted #336633;}
table td{border-bottom:1px dotted #336633;border-right:1px dotted #336633;padding:5px;}
在做WebForm编程开发时用过MasterPage的同学,可能都对这东东情有独钟。今日在QQ群上,“家有萧萧”同学也提出了这样一个问题:VT支持MasterPage吗?
答案肯定是“不支持”,因为VTemplate模板引擎不是用于WebForm上的(当然如果非要用也是可以的),所以不支持Asp.net中的MasterPage技术。但“不支持”并不等于“没有”这功能!
方法一:
换个角度思考一下,VT其实也是可以用<vt:output>标签来达到MasterPage功能效果的。
回顾一下
5.15、<vt:output>数据输出标签元素
此标签可输出某个标签或文件的数据。标签样例:
<vt:output tagid="user" />
<vt:output file="output.html" charset="gb2312" />
标签中已定义的属性列表:
从上表可看出<vt:output>标签可以通过设置tagid属性输出其它标签的数据,所以我们可以用其来代替MasterPage中的ContentPlaceHolder控件。
比如我们定义一个这样的“MasterPage”页面(masterpage_content.html):
其中定义的MasterPage变量,可起开关作用!<vt:output>标签中的tagid就是子页面定义的内容标签。如果需要,可在MasterPage中定义多个<vt:output>标签,但注意tagid的定义。
以下是一个调用“MasterPage”的示例页面代码:
在上面模板中,先使用<vt:include>标签导入“MasterPage”页面内容,再调用<vt:set>标签设置MasterPage变量为“0“,这两个标签的顺序不能调反。这样做的原因是因为“VTemplate模版引擎”解析模版数据时是先上而下,当解析<vt:include>“MasterPage”页面中的<vt:output>标签,输出tagid=”PageContent”的标签(也就是那个<vt:if>标签)数据时,因为此时MasterPage变量是等于“1”,所以能执行
<vt:if id="PageContent" var="MasterPage" value="1">
这个条件标签里的内容。当执行完
<vt:set var="MasterPage" value="0" />
标签再执行
<vt:if id="PageContent" var="MasterPage" value="1">
这个条件标签时,因为条件已不符合,因此不会再次执行输出里面的数据。
至此,VTemplate中的“MasterPage“功能就“模仿”出来了。
(注:如果“MasterPage“页面中有多个<vt:output>标签,则子页面中也只是拷贝多少个同样判断条件但不同id的<vt:if>标签)。
注:具体示例代码请参考VTemplate.WebTester项目中的masterpage_test.ashx文件与模板
方法二: Panel标签
注:此标签是3.7版本里增加的标签
定义模板页,如masterpage.html, 代码如下:
在上面模板代码中定义了3个panel,也就是3个容器面板标签。
其它页面调用此masterPage.html,示例如下:
上面模板里,第一步先使用include标签导入模板页面,后跟着3个数据面板标签。解析此模板内容后,将输出以下数据:
也即是数据面板标签里的内容会代替容器面板里的数据输出。并且数据面板标签可以根据需要增加或减少,并不限制要和MaterPage里的容器面板标签的数量一致!
VTemplate项目托管在Google code上。
URL: http://net-vtemplate.googlecode.com/
SVN: http://net-vtemplate.googlecode.com/svn/src/VTemplate.Engine/
更多例子请参考VTemplate.WebTester项目:
http://net-vtemplate.googlecode.com/svn/src/VTemplate.WebTester/
注:已建立VTemplate模板引擎技术交流QQ群,欢迎各位加入参与项目开发或技术探讨。QQ群:884468
table td{border-bottom:1px dotted #336633;border-right:1px dotted #336633;padding:5px;}
在做WebForm编程开发时用过MasterPage的同学,可能都对这东东情有独钟。今日在QQ群上,“家有萧萧”同学也提出了这样一个问题:VT支持MasterPage吗?
答案肯定是“不支持”,因为VTemplate模板引擎不是用于WebForm上的(当然如果非要用也是可以的),所以不支持Asp.net中的MasterPage技术。但“不支持”并不等于“没有”这功能!
方法一:
换个角度思考一下,VT其实也是可以用<vt:output>标签来达到MasterPage功能效果的。
回顾一下
5.15、<vt:output>数据输出标签元素
此标签可输出某个标签或文件的数据。标签样例:
<vt:output tagid="user" />
<vt:output file="output.html" charset="gb2312" />
标签中已定义的属性列表:
名称 | 说明 |
id | 标签元素的Id,建议唯一但不强制。(可不定义) |
name | 标签元素的名称。(可不定义) |
tagid | 需要输出数据的其它标签元素Id。(可不定义) 注:如果未定义此属性则需要定义file属性 |
file | 需要输出数据的文件,可以为绝对路径或相对路径。(可不定义) 注:如果未定义此属性则需要定义tagid属性 |
charset | 读取文件时使用的编码。(可不定义) |
比如我们定义一个这样的“MasterPage”页面(masterpage_content.html):
<vt:set var="MasterPage" value="1" remark="设置一个变量,用于标示是处于MasterPage页中" /> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title> MasterPage 内容 </title> </head> <body> <a class="menu" href="http://www.cnblogs.com/%22>博客园</a> <a class="menu" href="http://www.cnblogs.com/kingthy%22>我的博客</a> <hr /> <!--vt[以下是输入子页面的数据内容]--> <vt:output tagid="PageContent" /> <hr /> <div align="center">©版权所有 Kingthy</div> </body> </html> |
以下是一个调用“MasterPage”的示例页面代码:
<vt:include file="masterpage_content.html" remark="导入MasterPage页面" /> <vt:set var="MasterPage" value="0" remark="设置一个变量,用于标示当前不处于MasterPage页中" /> <!--vt[根据MasterPage变量值来判断子页面的内容是否需要输出.这就限制了子页面的内容只在MasterPage页面中的output标签输出.]--> <vt:if id="PageContent" var="MasterPage" value="1"> <!--vt[子页面的内容必须放在此if标签内]--> <vt:for from="1" to="9" index="i"> <vt:for from="1" to="$i" index="j"> <vt:expression var="r" args="i" args="j" expression="{0}*{1}" />{$:i}*{$:j}={$:r} </vt:for> <br /> </vt:for> </vt:if> |
<vt:if id="PageContent" var="MasterPage" value="1">
这个条件标签里的内容。当执行完
<vt:set var="MasterPage" value="0" />
标签再执行
<vt:if id="PageContent" var="MasterPage" value="1">
这个条件标签时,因为条件已不符合,因此不会再次执行输出里面的数据。
至此,VTemplate中的“MasterPage“功能就“模仿”出来了。
(注:如果“MasterPage“页面中有多个<vt:output>标签,则子页面中也只是拷贝多少个同样判断条件但不同id的<vt:if>标签)。
注:具体示例代码请参考VTemplate.WebTester项目中的masterpage_test.ashx文件与模板
方法二: Panel标签
注:此标签是3.7版本里增加的标签
定义模板页,如masterpage.html, 代码如下:
<html> <head> <title> <vt:panel id="title" /> </title> <vt:panel id="head" /> </head> <body> <vt:panel id="body" /> </body> </html> |
其它页面调用此masterPage.html,示例如下:
<vt:include file="masterpage.html" /> <vt:panel container="title">测试页面</vt:panel> <vt:panel container="head"> <meta name="Keywords" content="关键字"> <meta name="Description" content="描述内容"> </vt:panel> <vt:panel container="body"> <h1>这是主体内容</h1> </vt:panel> |
<html> <head> <title>测试页面</title> <meta name="Keywords" content="关键字"> <meta name="Description" content="描述内容"> </head> <body> <h1>这是主体内容</h1> </body> </html> |
VTemplate项目托管在Google code上。
URL: http://net-vtemplate.googlecode.com/
SVN: http://net-vtemplate.googlecode.com/svn/src/VTemplate.Engine/
更多例子请参考VTemplate.WebTester项目:
http://net-vtemplate.googlecode.com/svn/src/VTemplate.WebTester/
注:已建立VTemplate模板引擎技术交流QQ群,欢迎各位加入参与项目开发或技术探讨。QQ群:884468
相关文章推荐
- VTemplate模板引擎的使用 - MasterPage篇
- JSONP与artTemplate模板引擎使用的示例--请求天气数据
- VTemplate模板引擎的使用--高级篇
- VTemplate模板引擎的使用--入门篇
- baiduTemplate——js模板引擎使用
- 前端模板引擎 artTemplate的 使用与进阶
- 模板引擎artTemplate及模板预编译器TmodJS的使用入门
- js模板引擎art-template使用方法
- VTemplate模板引擎的使用--进阶篇
- VTemplate模板引擎的使用--入门篇
- c#使用 VTemplate模板引擎制作html报表
- 玄宇说:简单的VTemplate模板引擎的使用
- VTemplate模板引擎的使用--高级篇
- 前端模板引擎 artTemplate的 使用与进阶
- js高效模板引擎artTemplate 的使用总结
- VTemplate模板引擎的使用--认识篇
- template-web.js模板引擎的使用之初级篇
- 使用template (模板引擎写的demo)
- artTemplate模板引擎简单介绍使用
- VTemplate模板引擎的使用--认识篇