`
xzer
  • 浏览: 16623 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

友好的开发框架-Asta4D（2）：可继承的模板与参数化嵌入

框架javawebasta4d 
阅读更多

1. 可继承模板

 

asta4d的模板文件是可继承的，同时，子模板文件允许对父模板的指定位置进行覆盖，追加，插入操作。

 

我们来看，给定一个parent.html ：

 

 

<html> 
    <head> 
        <afd:block id="block1"> 
            <link href="parent1.css" rel="stylesheet" type="text/css" /> 
        </afd:block> 
         
        <afd:block id="block2"> 
            <link href="parent2.css" rel="stylesheet" type="text/css" /> 
        </afd:block> 

        <title>extension sample</title> 
    </head> 
    <body> 
        <afd:block id="content">content</afd:block> 
    </body> 
</html>

 

 

子模板child.html通过“afd:extension”声明继承关系，并利用“afd:block”声明覆盖动作：

 

 

<html> 
<head></head> 
<body> 
<!-- (1) --> 
<afd:extension parent="parent.html"> 

    <!-- (2) --> 
    <afd:block append="block1"> 
        <link href="child1.css" rel="stylesheet" type="text/css" /> 
    </afd:block> 

    <!-- (3) --> 
    <afd:block insert="block2"> 
        <link href="child2.css" rel="stylesheet" type="text/css" /> 
    </afd:block> 

    <!-- (4) --> 
    <afd:block override="content "> 
        <div>hello</div> 
        <!-- (5) --> 
        <afd:embed target="/templates/embed.html" ></afd:embed> 
    </afd:block> 

</afd:extension> 
</body> 
</html>

 

 

注意，“afd:block”支持声明三种类型的覆盖工作： 前追加（insert），后追加（append）以及完全覆盖（override）。在示例的子模板文件中的“afd:embed”声明了一个额外的include动作，即将target的模板文件嵌入到当前模板文件中，我们来看看embed.html：

 

<html> 
<head></head> 
<body> 
    <!-- (6) --> 
    <afd:block append="block1"> 
        <link href="embed.css" rel="stylesheet" type="text/css" /> 
    </afd:block> 
    <div>good embed</div> 
</body> 
</html>

 

注意，当目标文件被嵌入后，目标文件中声明的afd:block标记同样有效，对被嵌入的文件来说，所有afd:block标记会被解释为对父模板的覆盖动作，而afd:block标记意外的部分，则被简单的嵌入到afd:embed声明的位置。

 

上述三个文件被模板引擎解释后，会得到如下的结果：

 

<html> 
<head> 
     
    <!—block1 --> 
    <link href="parent1.css" rel="stylesheet" type="text/css" /> 
    <link href="child1.css" rel="stylesheet" type="text/css" /> 
    <link href="embed.css" rel="stylesheet" type="text/css" /> 

    <!—block2 --> 
    <link href="child2.css" rel="stylesheet" type="text/css" /> 
    <link href="parent2.css" rel="stylesheet" type="text/css" /> 

    <title>extension sample</title> 

</head> 
<body> 

    <!—content --> 
    <div>hello</div> 

    <!—embed --> 
    <div>good embed</div> 

</body> 
</html>

 

2. 参数化嵌入

 

在通过afd:embed标记导入外部模板文件时，可以通过指定DOM属性的方式向外部模板文件传入参数： 

 

<afd:embed target="/xxx/showList.html" showLimit="30"></afd:embed>

 

上述例子中指定的showLimit参数在目标文件showList.html的渲染逻辑中可以通过参数注入访问，从而实现参数化渲染逻辑。这个特性对于定义页面组件非常有用，将通用的HTML片段封装起来通过embed引入，同时通过参数传递来控制行为，基本上来说，在模板中引用一个embed文件，类似于一次可传参的函数调用。特别需要指出的是，这里的参数并不限于在模板文件中静态指定，在运行时同样可以动态指定embed参数，而且，参数类型也不仅限于可字符串化的字符或者数值类型，在运行时动态指定的embed参数可以是任意Java类型。更详细的关于参数化嵌入的说明，可以参考后述的渲染逻辑的部分。 

 

3. 总结


简单的讲，Asta4D的模板思想类似于传统的OOP模式，可以将父子模板视同为父子类的关系，而block则可以被视作可覆盖的虚方法。至于embed的外部文件，可以视同函数调用，事实上，既然你可以向embed的文件传递任意类型的参数，因此它和函数调用的确没有什么区别。

 

分享到：
| 友好的开发框架-Asta4D（1）：为什么Asta ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics