07.HTML標籤以及自定義定界符配置---《Beetl視頻課程》

本期視頻實現了評論列表分頁；

內容簡介：使用了HTML完成分頁抽取，並且介紹了自定義定界符

一起學beetl目錄：https://my.oschina.net/u/1590490?tab=newest&catalogId=6214598

作者：GK

---

HTML標籤

Beetl 也支持HTML tag形式的標籤，個人認爲，這是一種引用模板更加優雅的實現，能和靜態HTML標籤融爲一體。

比如在一個模板中引用另外一個模板，我們可以使用include

 <%include("/common/page.html",{page:msgPage,action:"detail",condition:"&id="+blog.id!}){}%>

我們也可以爲 page.html定義一個HTML標籤,那他的調用方法就變成了下面這種。

<#page page="${msgPage}" condition='${"&id="+blog.id!}' action="detail"/>

是不是更加符合，靜態HTML標籤的習慣。

一、配置
HTML標籤默認配置

#支持HTML標籤
HTML_TAG_SUPPORT = true

#標籤以#號開頭識別爲HTML標籤
HTML_TAG_FLAG = #

#自定義標籤文件Root目錄和後綴
RESOURCE.tagRoot = htmltag
RESOURCE.tagSuffix = tag

如果想修改配置，直接在根目錄下的 beetl.properties 當中修改覆蓋就行

二、使用
在templates（你定義的模板目錄）下新建htmltag，並且新建標籤page.tag,定義標籤內容：

<div class="paging">
    <%if(page.pageNumber <= 1){%>
    <a href="#">首頁</i></a>
    <%}else{%>
    <a href="${ctxPath}/${action!}?pageNumber=${page.pageNumber-1}${condition!}">上一頁</i></a>
    <%}%>

    <%if(page.pageNumber >= page.totalPage){%>
    <a href="#">末尾頁</i></a>
    <%}else{%>
    <a href="${ctxPath}/${action!}?pageNumber=${page.pageNumber+1}${condition!}">下一頁</i></a>
    <%}%>
</div>

在需要調用標籤的模板中寫入：

<#page page="${msgPage}" condition='${"&id="+blog.id!}' action="detail"/>

Beetl自定義標籤的傳參形式，與HTML習慣保持一致，採用“屬性=值”的方式，值必須使用雙引號或者單引號，引起來。

三、其他的注意事項

• 可以在自定義標籤裏引用標籤體的內容，標籤體可以是普通文本，beetl模板，以及嵌套的自定義標籤等。如上<#richeditor 標籤體裏，可用“tagBody”來引用
• HTML自定義標籤 的屬性值均爲字符串 如<#input value=“123” />,在input.tag文件裏 變量value的類型是字符串
• 可以在屬性標籤裏引用beetl變量，如<#input value="${user.age}" />，此時在input.tag裏，value的類型取決於user.age
• 在屬性裏引用beetl變量，不支持格式化，如<#input value="${user.date,‘yyyy-MM-dd’}"/>,如果需要格式化，需要在input.tag文件裏自行格式化
• 在標籤屬性裏傳json變量需要謹慎，因爲json包含了"}",容易與佔位符混合導致解析出錯，因此得使用"“符號，如<#input value=”${ {age:25} }" />
• html tag 屬性名將作爲 其對應模板的變量名。如果屬性名包含“-”，則將轉爲駝峯命名的變量，如data-name,轉爲dataName
• 默認機制下，HTMLTagSupportWrapper2 實現了標籤（2.8.x以前使用HTMLTagSupportWrapper）

具體請參考視頻教程，或者gitee中的源碼

---

自定義定界符與佔位符

定界符與佔位符在之前的博客中已經介紹過。

定界符就是界定靜態代碼與Beetl代碼的符號。

佔位符就是在靜態代碼中，爲Beetl編譯的結果佔據一個位置，（可以回憶一下el表達式）。

定界符與佔位符的默認配置如下：

#佔位符開始符號
DELIMITER_PLACEHOLDER_START=${
#佔位符的結束符號
DELIMITER_PLACEHOLDER_END=}
#定界符開始符號
DELIMITER_STATEMENT_START=<%
#定界符結束符號
DELIMITER_STATEMENT_END=%>

自定義配置

在根目錄下的 beetl.properties中修改配置，比如

#定界符開始符號
DELIMITER_STATEMENT_START=@
#定界符結束符號
DELIMITER_STATEMENT_END=

@ 和回車換行 (此時,模板配置DELIMITER_STATEMENT_END= 或者 DELIMITER_STATEMENT_END=null 都可以)

結束符留空，或者=null 表示 是以回車作爲結尾。

---

項目git地址：https://gitee.com/gavink/beetl-blog

視頻地址：下載下來會更清晰，視頻比較長，可使用倍速看

百度網盤下載: https://pan.baidu.com/s/1LyxAxlKpVXgVjwSXIbzBuA 提取碼: 68im

在線播放地址：bilibili (可以調節清晰度): https://www.bilibili.com/video/av36278644/?p=7

博客目錄：https://my.oschina.net/u/1590490?tab=newest&catalogId=6214598