如何建立模板

Created: November-22, 2018

為一個應用程式設定模板

在/WEB-INF 資料夾下建立一個名為 template.xhtml 的檔案，這樣模板檔案只能用於框架。

/WEB-INF/template.xhtml

<!DOCTYPE html>
<html lang="en"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets">

    <h:head>
        <title><ui:define name="title">Default title</ui:define></title>
    </h:head>

    <h:body>
        <!-- Some styles that we might include for our whole application -->
        <h:outputStylesheet name="css/template.css" />

        <!-- Shared content for the application, e.g. a header, this can be an include -->
        <div>
            Application Header
        </div>

        <!-- The content we want to define in our template client -->
        <div>
            <ui:insert name="content" />
        </div>
    </h:body>
</html>

此檔案將充當應用程式的模板。現在我們將在檢視目錄中定義一個特定的檢視。

/home.xhtml

<ui:composition template="/WEB-INF/template.xhtml"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets">

    <ui:define name="title">Home</ui:define>

    <ui:define name="content">
        Welcome to the application!
    </ui:define>
</ui:composition>

看看這個客戶端檢視中的 template 屬性，這告訴 JSF 使用我們想要的模板。然後，使用 <ui:define>，我們定義要插入模板中的特定內容。在客戶端訪問/home.xhtml 將呈現整個結果。