Springboot集成Freemarker學習筆記1

本文IDE:idea
環境:maven+Springboot+Freemarker
文件結構:
在這裏插入圖片描述
本文采取的測試方法有【1、固定值;2、循環生成固定值;3、讀取配置文件;4、讀取數據庫】

1、pom.xml 文件導包

   <!--這個包是服務於@ConfigurationProperties註解的-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-configuration-processor</artifactId>
            <optional>true</optional>
        </dependency>

        <!--Freemarker插件包-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-freemarker</artifactId>
        </dependency>
        <!--lombok插件-->
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <version>1.16.16</version>
        </dependency>

2、創建Controller

package com.uflinux.demo.controller;
import com.uflinux.demo.util.Resource;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
/**
 * @program: springbootdemo
 * @description:第一個Freemarker的Demo,獲取靜態值返回並生成頁面
 * @author: Feng_Lei
 * @create: 2020-04-15 17:47
 **/
@Controller
public class FreeMarkerCtrl {
/**
* @Description: 一、此處是第一個Freemarker的例子
* @Param: [表達意思爲返回一個model,key=name,並獲取寫死的那麼的值,最後返回到demo。html頁面]
* @return: java.lang.String
* @Author: Mr.Feng
* @Date: 2020/4/15
*/
    @RequestMapping(value = "index")
    public String index(Model map){
        map.addAttribute("title","這是一個靜態表格的ftl");
        map.addAttribute("name","風斯托洛夫斯基");
        map.addAttribute("age","30+");
        map.addAttribute("phone","110");

        return "freemarker/center";
    }
    /**
    * @Description:下面的這個方法預想是得到一個類的值,通過動態生成數據
    * @Param:
    * @return:返回的是動態生成的列表
    * @Author: Mr.Feng
    * @Date: 2020/4/15
    */
    @RequestMapping(value ="center")
    public String  center(ModelMap map){
        //此處調用類內部方法,獲得數據,返回的是一個users的集合map,的視圖
        //在center2的ftl中呢,是使用了ftl的list標籤,別名是user,然後獲得user的每一個子項
        map.put("users",parseUsers());
        map.put("title","用戶列表");
        return "freemarker/center2";
    }
    //此處是一個類內部方法
    private List<Map> parseUsers(){
        List<Map> list= new ArrayList<>();
        for(int i=0;i<100;i++){
            Map map= new HashMap();
            map.put("name","kevin_"+i);
            map.put("age",10+i);
            map.put("phone","1860291105"+i);
            list.add(map);
        }
        return list;
    }


    @Autowired
    private Resource resource;//此處使用的是spring的注入方式
    @RequestMapping("demo")//二級路徑
    public String hello(Model model){//返回視圖層
        //下面的三個選項是基於讀取配置文件二得到的內容
        model.addAttribute("name",resource.getName());
        model.addAttribute("language",resource.getLanguage());
        model.addAttribute("Website",resource.getWebsite());
        return "freemarker/demo";
    }
}

2、Freemarker工具類Resource

package com.uflinux.demo.util;

import lombok.Data;
import lombok.EqualsAndHashCode;
import lombok.ToString;
import org.springframework.boot.context.properties.ConfigurationProperties;
import org.springframework.context.annotation.Configuration;
import org.springframework.context.annotation.PropertySource;

/**
 * @program: springbootdemo
 * @description:
 * @author: Feng_Lei
 * @create: 2020-04-15 17:49
 **/


//表示這個類是一個讀取配置文件的類
@Data
@Configuration

//指定配置的一些屬性,其中的prefix表示前綴
//大致代表讀取文件中內容的key是什麼,具體是什麼是自定義的
@ConfigurationProperties(prefix = "com.uflinux")
/*
此處如果缺少【spring-boot-configuration-processor】的pom配置,則會出現【Spring引導配置註釋處理器未配置】的錯誤
 */

//指定所讀取的配置文件的路徑
@PropertySource(value = "classpath:resource.properties")
public class Resource {

    private String name ;
    private String website;
    private String language;

    //...setter and getter


}

3、application.properties

spring:
  mvc:
    static-path-pattern:/static/**
    view:
      suffix:.html
      prefix:/
  freemarker:
    cache: false #關閉模板緩存,方便測試
    settings:
         template_update_delay: 0 #檢查模板更新延遲時間,設置爲0表示立即檢查,如果時間大於0會有緩存不方便進行模板測試
#設定ftl文件路徑
    template-loader-path:classpath:/templates
#設定靜態文件路徑,js,css等
#    freemarker靜態資源配置

#       設定ftl文件路徑
spring.freemarker.tempalte-loader-path=classpath:/templates
#        關閉緩存,及時刷新,上線生產環境需要修改爲true
spring.freemarker.cache=false
spring.freemarker.charset=UTF-8
spring.freemarker.check-template-location=true
spring.freemarker.content-type=text/html
spring.freemarker.expose-request-attributes=true
spring.freemarker.expose-session-attributes=true
spring.freemarker.request-context-attribute=request
spring.freemarker.suffix=.ftl

4、resource.properties

實體類配置文件

com.uflinux.name=China
com.uflinux.website=www.baidu.top:18158/
com.uflinux.language=chinese

5、在templates/freemarker目錄下,創建flt文件(PS:demo.ftl;center.ftl;center2.ftl)

center:

<html lang="zh-CN">
<head>
    <meta charset="UTF-8"/>
    <title>${title}</title>
    <style>
        table {
            width: 50%;
            font-size: .938em;
            border-collapse: collapse;/*邊框合併*/
        }
        th {
            text-align: left;
            padding: .5em .5em;
            font-weight: bold;
            background: #66677c;color: #fff;
        }

        td {
            padding: .5em .5em;
            border-bottom: solid 1px #ccc;
        }

        table,table tr th, table tr td { border:1px solid #0094ff; }/*設置邊框*/
    </style>
</head>
<body>
<table>
    <tr>
        <th>Name</th>
        <th>Age</th>
        <th>Phone</th>
    </tr>
   <#-- <#list users as user>-->
        <tr>
            <td>${name}</td>
            <td>${age}</td>
            <td>${phone}</td>
        </tr>
    <#-- </#list>-->
</table>
</body>
</html>

center2 :

<html lang="zh-CN">
<head>
    <meta charset="UTF-8"/>
    <title>${title}</title>
    <style>
        table {
            width: 50%;
            font-size: .938em;
            border-collapse: collapse;/*邊框合併*/
        }
        th {
            text-align: left;
            padding: .5em .5em;
            font-weight: bold;
            background: #66677c;color: #fff;
        }

        td {
            padding: .5em .5em;
            border-bottom: solid 1px #ccc;
        }

        table,table tr th, table tr td { border:1px solid #0094ff; }/*設置邊框*/
    </style>
</head>
<body>
<table>
    <tr>
        <th>Name</th>
        <th>Age</th>
        <th>Phone</th>
    </tr>
    <#list users as user>
    <tr>
        <td>${user.name}</td>
        <td>${user.age}</td>
        <td>${user.phone}</td>
    </tr>
     </#list>
</table>
</body>
</html>

demo:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>FreeMarker頁面</title>
</head>
<body>

FreeMarker模板引擎
<h1>${name}</h1>
<h1>${language}</h1>
<h1>${Website}</h1>
</body>
</html>

分別得到的頁面截圖
1、index方法在這裏插入圖片描述
2、center方法
在這裏插入圖片描述
3、demo方法
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章