隨著2.0版的發布，Facelet模板成為JSF規范的核心部分。 使用<ui：composition>和<ui：decorate>標記，可以輕松構建復雜的頁面，同時仍保持標記清晰。 模板在創建HTML表單時特別有用，但是不幸的是，模板的確會在您的xhtml文件中引起重復，從而破壞了良好軟件設計的DRY（不要自己重復）原理 。 作為在JSF和Spring之間提供更深層集成的項目的一部分，我開發了兩個新組件，旨在簡化模板。 在探究新組件之前，讓我們看一下如何使用標準JSF模板構建典型表單。

表單模板的初始起點通常是為每個輸入添加一些模板。 通常，您需要額外的<div>或<span>標記以供CSS使用。 這是一個典型的例子：

<!-- /WEB-INF/pages/entername.xhtml -->
<ui:decoreate template="/WEB-INF/layout/form.xhtml"><h:inputText id="firstName" label="First Name" value="#{bean.firstName}"/><ui:param name="label" value="First Name"/><ui:param name="for" value="firstName"/>
</ui:decorate>
<ui:decoreate template="/WEB-INF/layout/form.xhtml"><h:inputText id="lastName" label="Last Name" value="#{bean.lastName}"/><ui:param name="label" value="Last Name"/><ui:param name="for" value="lastName"/>
</ui:decorate>
<!-- Many additional form elements -->

<!-- /WEB-INF/layout/form.xhtml -->
<ui:composition><div class="formElement"><span class="formLabel"><h:outputLabel for="#{for}" label="#{label}"></span><ui:insert/></div>
</ui:composition>

在這里，我們可以看到表單上的每個項目都包含在<div>中，并且表單標簽被包裹在其他<span>中 。 標記中已經存在一些重復，“ for”參數反映了組件ID。 我還給每個<h：inputText>元素一個標簽屬性
為了獲得更好的驗證錯誤消息，請在“標簽” <ui：param>中重復此操作。 如果我們想用星號標記必填字段，情況會變得越來越糟：

<!-- /WEB-INF/pages/entername.xhtml -->
<ui:decoreate template="/WEB-INF/layout/form.xhtml"><h:inputText id="firstName" label="First Name" value="#{bean.firstName}" required="false"/><ui:param name="label" value="First Name"/><ui:param name="for" value="firstName"/><ui:param name="showAsterisk" value="false"/>
</ui:decorate>
<ui:decoreate template="/WEB-INF/layout/form.xhtml"><h:inputText id="lastName" label="Last Name" value="#{bean.lastName}" required="true"/><ui:param name="label" value="Last Name"/><ui:param name="for" value="lastName"/><ui:param name="showAsterisk" value="true"/>
</ui:decorate>
<!-- Many additional form elements -->

<!-- /WEB-INF/layout/form.xhtml -->
<ui:composition><div class="formElement"><span class="formLabel"><h:outputLabel for="#{for}" label="#{label}#{showAsterisk ? ' *' : ''}"></span><ui:insert/></div>
</ui:composition>

非常令人沮喪的是，我們需要傳遞<ui：param>項，這些項與<h：inputText>上已經指定的屬性重復。 很容易看出，即使是相對較小的表單，我們也將最終在標記中重復很多。 我們需要的是一種獲取有關模板中插入的組件的信息的方法，即使我們不知道組件將是哪種類型。 我們需要的是<s：componentInfo> 。

<s：componentInfo>組件公開一個變量，其中包含有關所插入組件的信息。 此信息包括標簽 ，組件clientID以及是否需要該組件。 通過檢查插入的項目，我們可以刪除很多重復項：

<!-- /WEB-INF/pages/entername.xhtml -->
<ui:decoreate template="/WEB-INF/layout/form.xhtml"><h:inputText id="firstName" label="First Name" value="#{bean.firstName}" required="false"/>
</ui:decorate>
<ui:decoreate template="/WEB-INF/layout/form.xhtml"><h:inputText id="lastName" label="Last Name" value="#{bean.lastName}" required="true"/>
</ui:decorate>
<!-- Many additional form elements -->

<!-- /WEB-INF/layout/form.xhtml -->
<ui:composition><s:componentInfo var="info"><div class="formElement"><span class="#{info.valid ? 'formLabel' : 'formErrorLabel'}"><h:outputLabel for="#{info.for}" label="#{info.label}#{info.required ? ' *' : ''}"></span><ui:insert/></div></s:componentInfo>
</ui:composition>

我們現在可以做的其他事情就是判斷插入的組件是否通過了驗證。 請注意，上面的示例將為無效的組件選擇“ formErrorLabel ” CSS類。

擁有新的<s：componentInfo>組件的一項有趣功能是，所有<ui：decorate>標記都變得相同。 我們已刪除了標簽內的所有重復，但是標簽本身仍然重復了很多次。 在這里，我們還有另外一個技巧，可以通過引入新的<s：decorateAll>標簽來提供幫助。 使用<s：decorateAll>允許對每個子組件一次應用模板。 這是更新的表單標記：

<!-- /WEB-INF/pages/entername.xhtml -->
<s:decoreateAll template="/WEB-INF/layout/form.xhtml"><h:inputText id="firstName" label="First Name" value="#{bean.firstName}" required="false"/><h:inputText id="lastName" label="Last Name" value="#{bean.lastName}" required="true"/><!-- Many additional form elements -->
</s:decorateAll>

<!-- /WEB-INF/layout/form.xhtml -->
<ui:composition><s:componentInfo var="info"><div class="formElement"><span class="#{info.valid ? 'formLabel' : 'formErrorLabel'}"><h:outputLabel for="#{info.for}" label="#{info.label}#{info.required ? ' *' : ''}"></span><ui:insert/></div></s:componentInfo>
</ui:composition>

如果要查看這些組件的源代碼，請查看springfaces GitHub項目上的org.springframework.springfaces.template.ui軟件包。

參考： 將Spring和JavaServer Faces集成：改進的模板來自Phil Webb博客中的JCG合作伙伴 Phillip Webb。