Facelets 标签参考1
Facelets标签参考lxm翻译自《Facelets Essentials: Guide to JavaServer™ Faces View Definition Framework 》
不当之处欢迎指正。
<ui:component/>
<ui:component>标签在JSF组件树中插入一个UIComponet实例,并作为所有它所包含的组件或内容片断的根节点。表格1-4列出它的属性。
表格1-4: <ui:component>标签属性
属性名称
必需
描述
id
否
和所有的组件一样,可以这它提供一个id,如果没有设置,Facelets将按照JSF的规则为它创建一个。
binding
否
按照JSF的规范,这个属性的作用是通过指向Managed Bean的一个属性来引用UIComponet的实例,如果Managed Bean的这个个属性没有事先初始化,UIComponet实例将惰性(lazily) 被创建.
这个标签以外的内容将被编译器忽略,因此不会显示在视图中。
这里以及这里以前的内容将被忽略
<ui:component binding="#{backingBean.myComponent}">
<div>The directory contains #{totalBirds} birds!</div>
</ui:component>
这里以及这里后的内容将被忽略
产生的Html输出为:
The directory contains #{totalBirds} birds!
<ui:fragment/>
<ui:fragment>标签相似,不同的是<ui:fragment>标签外部的内容不会被忽略。下列表格列出它的属性。
表格: <ui:fragment>标签属性
属性名称
必需
描述
id
否
和所有的组件一样,可以这它提供一个id,如果没有设置,Facelets将按照JSF的规则为它创建一个。
binding
否
按照JSF的规范,这个属性的作用是通过指向Managed Bean的一个属性来引用UIComponet的实例,如果Managed Bean的这个个属性没有事先初始化,UIComponet实例将惰性(lazily) 被创建.
<ui:component>标签在JSF组件树中插入一个UIComponet实例,并作为标签内部所有它所包含的组件或内容片断的根节点,标签外部的内容编译时会被包含进来。
举例:
This will not be ignored
<ui:fragment>
<div>
<h:outputText value="I want #{eagle.total} eagles."/>
</div>
</ui:fragment>
This will not be ignored
产生输出:
This will not be ignored
<div>I want 3 eagles.</div>
This will not be ignored
<ui:composition/>
<ui:composition>标签是一个模板标签,它将一些可以被其它Facelets页面所包含的内容封装起来。表格1-5列出它的属性。
表格1-5: <ui:component>标签属性
属性名称
必需
描述
template
否
将在标签开始和结束之间显示的模板文件所在的路径
<ui:composition>指定使用哪个模版文件,然后通过<ui:define>对模版文件中每个可供插入的“<ui:insert>锚点”进行定义。在运行期,具体的内容将会被插入到<ui:composition>中定义的锚点位置。
和ui:component 一样,这个标签以外的内容将被编译器忽略,不会显示在视图中,和 ui:component不同的是, ui:composition不会在组件树上创建节点。
这里以及这里以前的内容将被忽略
<ui:composition>
<h:outputText value="#{bird.lifeExpectancy}" />
</ui:composition>
这里以及这里后的内容将被忽略
例如:
<ui:composition template="bird-template.xhtml">
<ui:define name="title">Input Name</ui:define>
<ui:define name="summary">
<h:panelGrid columns="2">
<h:outputText value="Bird Name"/>
<h:outputText value="#{bird.name}"/> 34 Facelets Essentials
<h:outputText value="Life expectancy"/>
<h:outputText value="#{bird.lifeExpectancy}"/>
</h:panelGrid>
</ui:define>
</ui:composition>
这样 composition标签内的内容按 bird-template.xhtml模板文件的定义显示,模板文件中中必须有<ui:insert name="title">和<ui:insert name="summary">的定义。
创建一个组合视图主要使用ui:composition, ui:define和ui:insert 标签。
<ui:decorate/>
<ui:decorate>标签和<ui:composition>标签相似,唯一不同的是它不忽略标签外部的内容。
表格1-6列出它的属性。
表格1-6: <ui:decorate>标签属性
属性名称
必需
描述
template
否
将在标签开始和结束之间显示的模板文件所在的路径
例子:
Listing 1-10. box-template.xhtml
<!DOCTYPE html PUBLIC "-//W3C//DTD ¬
XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/ ¬
xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"> 36 Facelets Essentials
<body>
<ui:composition>
<div style="border: 1px solid black; display:block">
<ui:insert name="header"/>
</div>
<div style="border: 1px solid black; display:block">
<ui:insert name="content"/>
</div>
</ui:composition>
</body>
</html>
Listing 1-11. decorate-example.xhtml
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/ ¬
xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html">
<head>
<title>Decorate example</title>
</head>
<body>
<p>These are the birds in today's menu:</p>
<ui:decorate template="box-template.xhtml">
<ui:define name="header">
Happy Parrot
</ui:define>
<ui:define name="content">
How many parrots do you want?
<h:inputText value="3"/>
</ui:define>
</ui:decorate>
<br/>
<ui:decorate template="box-template.xhtml">
<ui:define name="header">
Mighty Eagle
</ui:define>
<ui:define name="content">
Eagles are not available now.
</ui:define>
</ui:decorate>
</body>
</html>
html输出内容:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Decorate example</title>
</head>
<body>
<p>These are the birds in today's menu:</p>
<div style="border: 1px solid black; display:block">
Happy Parrot
</div>
<div style="border: 1px solid black; display:block">
How many parrots do you want?
<input id="_id6" name="_id6"
type="text" value="3" />
</div>
<br/>
<div style="border: 1px solid black; display:block">
Mighty Eagle
</div>
<div style="border: 1px solid black; display:block">
Eagles are not available now.
</div>
</body>
</html>
<ui:define/>
ui:define标签用于将命名的内容插入到模板中,它在模板标签(如composition和decorate)的内部使用。Define的name属性必须和目标模板中ui:insert标签的name属性一致。表格1-7列出它的属性。
表格1-7: <ui:define>标签属性
属性名称
必需
描述
name
是
必须和目标模板中ui:insert标签的name属性一致
举例1:
<ui:decorate template="box-template.xhtml">
<ui:define name="header">
Happy Parrot
</ui:define>
this will be removed
<ui:define name="content">
How many parrots do you want?
</ui:define>
</ui:decorate>
define标签内部的内容将被插入到目标模板中name相同的insert标签处。define标签外部的内容将被忽略。
举例2:
Listing 1-12. define-template.xhtml
<h:outputText value="Which bird sings like this? "/>
<ui:insert name="song"/>
define-example.xhtml
This will be ignored
<ui:composition template="define-template.xhtml">
<ui:define name="song">
<h:outputText value="cock-a-doodle-doo"/>
</ui:define>
</ui:composition>
这个例子输出:
Which bird sings like this? cock-a-doodle-doo
<ui:insert/>
ui:insert 标签用来在模板中指定一个插入点,可以被客户端模板中ui:define定义的内容所代替。表格1-8列出它的属性。
表格1-8: <ui:insert>标签属性
属性名称
必需
描述
name
否
用来和客户端模板中ui:define标签的name属性相一致,如果没有指定,整个客户端模板将被插入。
如果模板中某个insert标签在客户端模板中没有定义对应的define,则使用模板中的默认值。
Listing 1-13. insert-template.xhtml
<!DOCTYPE html PUBLIC "-//W3C//DTD ¬
XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/ ¬
xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets">
<body>
<h1>
<ui:insert name="title">
No title
</ui:insert>
</h1>
<div>
<ui:insert name="content">
No content is defined
</ui:insert>
</div>
</body>
</html>
我们需要一个客户端模板,如下:
Listing 1-14. insert-client.xhtml
<ui:composition template="insert-template.xhtml">
<ui:define name="title">
The Parrot Quest
</ui:define>
</ui:composition>
我们只定义了title的内容,所以content使用默认值。输出如下:
<h1>
The Parrot Quest
</h1>
<div>
No content is defined
</div>
name属性是可选的,如果没有被指定,整个客户端模板将被插入。也没必须要客户端模板定义define。如下:
Listing 1-15. insert-template2.xhtml
<!DOCTYPE html PUBLIC "-//W3C//DTD ¬
HTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/ ¬
xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets">
<body>
<div>
<h1>One story of Birds</h1>
<ui:insert/>
</div>
</body>
</html>
Listing 1-16. insert-client2.xhtml
<ui:composition template="insert-template2.xhtml">
One day I decided to start counting
the number of parrots in the world,
just to find that...
<br/>
<h:inputTextarea value="#{backingBean.story}"/>
</ui:composition>
输出如下:
<div>
<h1>One story of Birds</h1>
One day I decided to start counting
the number of parrots in the world,
just to find that...
<br />
<textarea name="_id3"></textarea>
</div>
<ui:include/>
<ui:include/> 标签用来在文件中包含另外一个Facelets文件,它只需要指定被包含文件的位置。它可以包含任何拥有 ui:component或ui:composition等标签或是简单的XHTML或XML代码片断的文件。下列表格列出它的属性。
表格: <ui:include>标签属性
属性名称
必需
描述
src
是
属性的值可以是简单的值或是EL表达式,用来指定被包含的Faclets文件的位置,可以是相对路径也可以是绝对路径。
举例:
<div>
<ui:include src="#{backingBean.currentMenu}"/>
</div>
页:
[1]