beetl模版for循环渲染字符串

最新推荐文章于 2023-01-05 09:12:33 发布

原创最新推荐文章于 2023-01-05 09:12:33 发布 · 1.3w 阅读

5 ·

CC 4.0 BY-SA版权

本文解决了你的问题吗？转载注明链接,帮助更多人。

文章标签：

#beetl #for 循环 #beetl for #beetl if

大前端开发专栏收录该内容

157 篇文章

订阅专栏

本文深入探讨了 Beetl 模板引擎的各种功能，包括 for 循环渲染 HTML 字符串、if 条件判断输出、自定义标签、html 赋值、json 渲染等。同时介绍了 Beetl 的定界符、占位符、注释及变量定义，展示了如何使用 Beetl 进行变量格式化和选择性输出。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

beetl for循环渲染html字符串的方式,beetl if条件判断输出,beet自定义标签和标签引用,beetl html赋值,beetl渲染json,beetl注释、变量定义,更多文档请到：http://ibeetl.com/guide/#beetl

beetl for循环输出

beetl for输出select option
<select>
    @for(item in list){
        <option value="${item.id}">${item}</option>
    @}
</select>

beetl for输出ul li html

<ul>
    @for(item in list){
        <li>${item}</li>
    @}
</ul>

beetl定界符和占位符

@ 和回车换行
#: 和回车换行
<? 和 ?>
占位符--#{ }-##

定界符号里是表达式，如果表达式跟定界符或者占位符有冲突，可以在用 “\” 符号，如

@for(user in users){
    email is ${user.name}\@163.com
@}
${[1,2,3]} //输出一个json列表
${ {key:1,value:2 \}  } //输出一个json map，} 需要加上\

beetl注释

Beetl语法类似js语法，所以注释上也同js一样：单行注释采用// 多行注视采用/* */

<%
/*此处是一个定义变量*/
var a = 3; //定义一个变量.

/* 以下内容都将被注释
%>

<% */ %>

beetl赋值

赋值于html中常用 ${ 服务端的变量 } 来做，这个于jsp是一致的。例如：

<input value="${value}">
<div>${html}</div>

beetl if选择性输出变量格式化

支持三元表达式

${a==1?"ok":''}
${a==1?"ok"}

<input type="checkbox" ${a==0? "checked"}>

<input  ${a==0?"readonly"} />

<select>
  <option ${a==1?"selected"}>hello</option>
  <option>world</option>
</select>

beetl标签函数

如果共用一个模版html

方法一:
<%
    layout("/temlet/layout.html"){
%>
//这里可以写上html
<% } %>

方法二:
@layout("/temlet/layout.html"){
    //这里可以写上html
@}

允许 include 另外一个模板文件

<%
include("/inc/header.html"){}
%>

自定义HTML标签

<#button name="提交" handle="add()"/>

file: /* button.tag */

<button onclick="${handle}">${name}</button>