html和freemarker模板引擎

html基础标签

1、标题：标题（heading）是通过<h1>-<h6>标签定义的

<h1>这是一个标题</h2>

2、段落：段落是通过标签<p>来定义的

<p>这是一个段落</p>

3、链接：链接是通过标签<a>来定义的

<a href="http://www.baidu.com">百度</a>

4、图片：图片是通过标签<img>来定义的

<img src="/lib/images/logo.png" width="258" height="39" />

5、表格：表格由<table>标签来定义的，每个表格均有若干行（由<tr>标签定义），每行被分割为单元格（由<td>标签定义）。字母td指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等

<table border="1">
    <tr>
        <td>row1,测试1</td>
        <td>row1,测试2</td>
    </tr>
    <tr>
        <td>row2，test1</td>
        <td>row2,test2</td>
    </tr>
</table>

6、无序列表，是一个项目的列表，此列项目使用粗体圆点（典型的小圆圈）进行标记，无序列表使用<ul>标签

<ul>
    <li>java</li>
    <li>python</li>
</ul>

7、有序列表，也是一列项目，列表项目使用数字标记，有序列表用<ol>标签，每个列表用<li>标签，列表项使用数字来标记

<ol>
    <li>java</li>
    <li>python</li>
</ol>

8、区块：<div>没有特定的含义，属于块级元素，如果与CSS一同使用，<div>元素可用对大的内容块设置样式属性

<div style="color: #0000ff;">
    <h3>这是一个在div元素中的标题</h3>
    <p>这是一个在div元素中的文本</p>
</div>

9、列表：<span>元素是内联元素，可用文本的容器<span>元素也没有特定的含义，当与CSS一同使用时，<span>元素可用于为部分文本设置样式属性

<p>我的有<span style="color:blue">蓝色</span>的眼睛</p>

 

freemarker模板引擎

一、添加依赖

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>

二、Application.properties配置
 

spring.freemarker.cache=false
spring.freemarker.charset=UTF-8
spring.freemarker.content-type=text/html
spring.freemarker.suffix=.ftl
spring.freemarker.template-loader-path=classpath:/templates
spring.freemarker.request-context-attribute=request

三、设置模版路径
resources路径下创建文件夹:templates
四、创建模版文件
1.后缀名:ftl
2.模版文件:view.ftl
3.index.ftl内容:你好 freemarker

@RequestMapping("/view")
public String view(Model model){
return "view";
}

1、设置变量与使用变量，第二种方式是从后端取值，取值方式是modelAndView.addObject("name",njl);,一般用第二种方式

设置变量：

<#assign name=" niu"/>

使用变量：

${name!}

2、空值处理

有感叹号的意思是如果空的话用空值代替，不使用！，空值会出现异常

${name!}

设置默认值

${name! "abc"}

3、时间格式化

${time?string("yyyy-MM-dd hh:mm:ss")}

4、Int类型数据处理，不会出现9，999这种情况了

${money?string("#")}

5、对象参数

model.addAttribute("user",user);
${user.age}

6、流程语句if,判断对象是否为空

<#if project??>
    ${proejct.name!}
<#else >
    不存在这个项目
</#if>

大于 gt   大于等于gte
小于 lt   小于等于lte

<#if money gt 5000>
    大于5000块钱
<#else >
小于5000块钱
</#if>

7、对象list 和普通list 的写法

<#list userList as user>
   <div>
       ${user.name}
       ${user.age}
   </div>
</#list>

<#list aList as l>
    <ol>
        <li>
        ${l}
        </li>
    </ol>
</#list>

8、macros指令，相当一个方法的封装,方法名，入参，下面是调用方式@methodName

宏指令
<#macro methodName param1 param2>
    <div>
        参数1:${param1}
        参数2:${param2}
    </div>
</#macro>
<@methodName "参数1" "参数2"/>

9、入参也可以是一个list，写法

传list
<#macro book bookList>
    <#list bookList as bb>
        ${bb}
    </#list>
</#macro>
<@book bookList=["a","b","c"]/>

10、<#nested>标签的使用，代表嵌套，使用场景是，上面是导航栏标签，下面是页面

<#macro methodName param1 param2>
    <div>
        参数1:${param1}
        参数2:${param2}
    </div>
    <div>
        具体的页面:<#nested/>
    </div>
</#macro>
<@methodName "参数1" "参数2">
    我是嵌套进来的参数
</@methodName>

上述的controller的代码

@Controller
@RequestMapping("/freemarker")
public class FreemarkerController {
    @RequestMapping("/free")
    public String free(Model model){
        model.addAttribute("money",8888);
        model.addAttribute("time",new Date());
        User user = new User();
        user.setName("牛");
        user.setAge(18);
        List list = new ArrayList();
        list.add(user);
        User user1 = new User();
        user1.setAge(20);
        user1.setName("牛2");
        list.add(user1);
        model.addAttribute("userList",list);
        List list1 = new ArrayList();
        list1.add("a");
        list1.add("b");
        list1.add("c");
        model.addAttribute("aList",list1);
        model.addAttribute("user",user);
        return "/free/freemarker";
    }
}