beetl模版for循环渲染字符串
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>
beetl模版for循环渲染字符串的更多相关文章
- Ajax接收Json数据,调用template模板循环渲染页面的方法
一. 后台接口吐出JSON数据 后台php接口中,需要写三个部分: 1.1 开头header规定数据格式: header("content-type:application/json;cha ...
- Vue 中渲染字符串形式的组件标签
在vue中如果要渲染字符串形式的标签,vue 提供了 v-html 指令,可以很方便的渲染出来.但是如果这个标签是一个组件,或者element-ui 的组件时,就不能解析出来了,因为v-html 只能 ...
- vue2.* 目录结构分析 数据绑定 循环渲染数据 数据渲染02
一.目录 结构分析 node_modules:项目依赖文件(也可以说是模块) src:开发时所用的资源 assets:静态资源文件 App.vue:根组件(最基础的公共页面) main.js:实例化v ...
- Vue如何循环渲染图片
Vue如何把服务器返回的图片数据渲染出来 首先,一般来说,当请求图片的接口时,会返回一个数组,这个数组里会是一些图片的名字,比如1.jpg,2.jpg. 我的做法是先在data里定义一个数组,来存储服 ...
- Spring Boot (二):模版引擎 Thymeleaf 渲染 Web 页面
Spring Boot (二):模版引擎 Thymeleaf 渲染 Web 页面 在<Spring Boot(一):快速开始>中介绍了如何使用 Spring Boot 构建一个工程,并且提 ...
- vue如何循环渲染element-ui中table内容
对于大多数前端开发者来说,vuejs+element-ui是开发后台管理系统过程中必不可少的技术框架.而后台管理系统中,最常见的形式就是表格和表单,以便用来增删改查. element-ui中table ...
- Python基础->for循环、字符串以及元组
python流程控制>for循环.字符串以及元组 学习有关序列的思想.序列:一组有顺序的东西.所有的序列都是由元素组成的,序列中的元素位置是从0开始编号的,最后一个元素的位置是它长度减一. fo ...
- Flutter中通过循环渲染组件
class ContactsState extends State<Contacts>{ List formList; initState() { super.initState(); f ...
- vue3——vue数据循环渲染
博客地址 :https://www.cnblogs.com/sandraryan/ vue循环渲染 <!DOCTYPE html> <html lang="en" ...
随机推荐
- spark——故障排除
故障排除一:控制reduce端缓冲大小以避免OOM 在Shuffle过程,reduce端task并不是等到map端task将其数据全部写入磁盘后再去拉取,而是map端写一点数据,reduce端task ...
- try catch 小结 , node的回调callback里不能捕获异常 , 不能被v8优化(现在能了),
<深入浅出Nodejs>时,在第四章 - 异步编程中作者朴灵曾提到,异步编程的难点之一是异常处理,书中描述"尝试对异步方法进行try/catch操作只能捕获当次事件循环内的异常, ...
- npm install 命令。默认会找到当前路径下的package.json。然后安装其中的依赖
npm install 命令.默认会找到当前路径下的package.json.然后安装其中的依赖 By default, npm install will install all modules li ...
- day008-python内置函数
一.ptthon内置函数 二.内置函数详细概述 2.1 abs(x):函数返回数字的绝对值. 注意: 1)x -- 数值表达式,可以是整数,浮点数,复数. 2)如果参数是一个复数,则返回它的大小. ...
- java 面向对象2
1. 类是对某一类事物的抽象描述,而对象用于表示现实中该类事物的个体. 玩具模型是类: 玩具是对象: ★局部变量和成员变量的区别: 区别一:定义的位置不同 定义在类中的变量是成员变量 定义在方法中或 ...
- [HNOI2016]序列 CDQ+DP
[HNOI2016]序列 CDQ 链接 loj 思路 一个点最小变为l,最大变为r,不变的时候为v 那么j能在i前面就要满足. \(j<i\) \(r[j]<=v[i]\) \(v[j]& ...
- luogu P1725 琪露诺
二次联通门 : luogu P1725 琪露诺 /* luogu P1725 琪露诺 DP + 线段树 用线段树维护dp[i - R] ~ dp[i - L]的最大值 然后 转移方程是 dp[i] = ...
- 自制Amiibo 踩坑/填坑 指南
去年买了台老版NS,后来得知有Amiibo这种东西的存在,但是学校附近都买不到. 再后来网上看见有人在X宝卖自制卡片,就寻思着是否能自己 DIY一套,于是掉坑里. 要想使用自制Amiibo,一共要做两 ...
- 计蒜客 41387.XKC's basketball team-线段树(区间查找大于等于x的最靠右的位置) (The Preliminary Contest for ICPC Asia Xuzhou 2019 E.) 2019年徐州网络赛
XKC's basketball team XKC , the captain of the basketball team , is directing a train of nn team mem ...
- 小说美句摘抄&&动漫壁纸
不知道为啥脑子一抽打算开个坑(反正咱是个不务正业的人) 大部分是网文里的,某些是轻小说里的,文学名著--咱也不像会看那个的人啊-- upd 2019.11.6:把一些自己觉得好的动漫壁纸贴一贴,图床用 ...