zoukankan      html  css  js  c++  java
  • Spring-boot(二)--thymeleaf

    Java代码  
    1. @Controller  
    2. @RequestMapping("/")  
    3. public class MessageController {  
    4.     private final MessageRepository messageRepository;  
    5.   
    6.     @Autowired  
    7.     public MessageController(MessageRepository messageRepository) {  
    8.         this.messageRepository = messageRepository;  
    9.     }  
    10.   
    11.     @RequestMapping  
    12.     public ModelAndView list() {  
    13.         Iterable<Message> messages = this.messageRepository.findAll();  
    14.         return new ModelAndView("messages/list", "messages", messages);  
    15.     }  
    16.   
    17.     @RequestMapping("{id}")  
    18.     public ModelAndView view(@PathVariable("id") Message message) {  
    19.         return new ModelAndView("messages/view", "message", message);  
    20.     }  
    21.   
    22.     @RequestMapping(params = "form", method = RequestMethod.GET)  
    23.     public String createForm(@ModelAttribute Message message) {  
    24.         return "messages/form";  
    25.     }  
    26.   
    27.     @RequestMapping(method = RequestMethod.POST)  
    28.     public ModelAndView create(@Valid Message message, BindingResult result,  
    29.             RedirectAttributes redirect) {  
    30.         if (result.hasErrors()) {  
    31.             return new ModelAndView("messages/form", "formErrors", result.getAllErrors());  
    32.         }  
    33.         message = this.messageRepository.save(message);  
    34.         redirect.addFlashAttribute("globalMessage", "Successfully created a new message");  
    35.         return new ModelAndView("redirect:/{message.id}", "message.id", message.getId());  
    36.     }  
    37.   
    38.     @RequestMapping("foo")  
    39.     public String foo() {  
    40.         throw new RuntimeException("Expected exception in controller");  
    41.     }  
    42.   
    43. }  

     注:@Controller:1:spring的控制层。2:spring的注解之一放在类名之前3:spring配置文件中如果配置了扫描包路径,自动检测该注释的类并注入。4:spring控制层可以接收请求,并且返回响应。

        @RequestMapping:用户请求路径是http://localhost:8080/项目名/类的@RequestMapping的value值/方法的@RequestMapping的value值。

        @Autowired:依赖注入。

        @PathVariable:rest访问方式获取参数传递

        ModelAndView:一次性返回model和view2个对象,有7个构造函数,用来设定返回对象和视图,也可以用set方法设置。

        @ModelAttribute:获取页面传递参数。也可以这样用

        

    Java代码  
    1. @ModelAttribute("user")    
    2. public User addAccount() {    
    3.    return new User("jz","123");    
    4. }    
    5.   
    6. @RequestMapping(value = "/helloWorld")    
    7. public String helloWorld(@ModelAttribute("user") User user) {    
    8.    user.setUserName("jizhou");    
    9.    return "helloWorld";    
    10. }  

      @SessionAttributes("user")用户同上只是使用范围不同而已。

      RedirectAttributes:我的理解是controller控制层跳转到控制层传递参数用的。

      @Valid:对实体类的一个验证。验证符合jpa的标准。要和BindingResult result配合使用,如果验证不通过的话,result.hasErrors(),跳转 。如一个实体类标准:

      

    Java代码  
    1. import javax.validation.constraints.Min;    
    2. import javax.validation.constraints.NotNull;    
    3. import org.hibernate.validator.constraints.NotBlank;    
    4.      
    5. public class User {    
    6.      
    7.     private String username;    
    8.        
    9.     private String password;    
    10.        
    11.     private int age;    
    12.      
    13.     @NotBlank(message="用户名不能为空")    
    14.     public String getUsername() {    
    15.        return username;    
    16.     }    
    17.      
    18.     public void setUsername(String username) {    
    19.        this.username = username;    
    20.     }    
    21.      
    22.     @NotNull(message="密码不能为null")    
    23.     public String getPassword() {    
    24.        return password;    
    25.     }    
    26.      
    27.     public void setPassword(String password) {    
    28.        this.password = password;    
    29.     }    
    30.      
    31.     @Min(value=10, message="年龄的最小值为10")    
    32.     public int getAge() {    
    33.        return age;    
    34.     }    
    35.      
    36.     public void setAge(int age) {    
    37.        this.age = age;    
    38.     }    
    39.        
    40. }    

    最后个方法就是抛出页面异常.

        

    html主要用ThyMeleaf标签,Thymeleaf是一个XML/XHTML/HTML5模板引擎,可用于Web与非Web环境中的应用开发。它是一个开源的Java库,基于Apache License 2.0许可,由Daniel Fern&aacute;ndez创建,该作者还是Java加密库Jasypt的作者。

    form.html代码如下:

    Html代码  
    1. <!DOCTYPE html>  
    2. <html xmlns:th="http://www.thymeleaf.org"  
    3.   xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"  
    4.   layout:decorator="layout">  
    5.   <head>  
    6.     <title>Messages : Create</title>  
    7.   </head>  
    8.   <body>  
    9.     <h1 layout:fragment="header">Messages : Create</h1>  
    10.     <div layout:fragment="content"  
    11.         class="container">  
    12.       <form id="messageForm"  
    13.           th:action="@{/(form)}"  
    14.           th:object="${message}"  
    15.           action="#"  
    16.           method="post">  
    17.         <div th:if="${#fields.hasErrors('*')}"  
    18.             class="alert alert-error">  
    19.           <th:each="error : ${#fields.errors('*')}"  
    20.               th:text="${error}">  
    21.             Validation error  
    22.           </p>  
    23.         </div>  
    24.         <div class="pull-right">  
    25.           <th:href="@{/}" href="messages.html">  
    26.             Messages  
    27.           </a>  
    28.         </div>  
    29.         <label for="summary">Summary</label>  
    30.         <input type="text"  
    31.             th:field="*{summary}"  
    32.             th:class="${#fields.hasErrors('summary')} ? 'field-error'"/>  
    33.         <label for="text">Message</label>  
    34.         <textarea  
    35.             th:field="*{text}"  
    36.             th:class="${#fields.hasErrors('text')} ? 'field-error'"></textarea>  
    37.         <div class="form-actions">  
    38.           <input type="submit" value="Create"/>  
    39.         </div>  
    40.       </form>  
    41.     </div>  
    42.   </body>  
    43. </html>  

     list.html代码如下:

    Html代码  
    1. <!DOCTYPE html>  
    2. <html xmlns:th="http://www.thymeleaf.org"  
    3.   xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"  
    4.   layout:decorator="layout">  
    5.   <head>  
    6.     <title>Messages : View all</title>  
    7.   </head>  
    8.   <body>  
    9.     <h1 layout:fragment="header">Messages : View all</h1>  
    10.     <div layout:fragment="content" class="container">  
    11.       <div class="pull-right">  
    12.         <href="form.html" th:href="@{/(form)}">Create Message</a>  
    13.        </div>  
    14.       <table class="table table-bordered table-striped">  
    15.         <thead>  
    16.           <tr>  
    17.             <td>ID</td>  
    18.             <td>Created</td>  
    19.             <td>Summary</td>  
    20.           </tr>  
    21.         </thead>  
    22.         <tbody>  
    23.           <tr th:if="${messages.empty}">  
    24.             <td colspan="3">  
    25.               No messages  
    26.             </td>  
    27.           </tr>  
    28.           <tr th:each="message : ${messages}">  
    29.             <td th:text="${message.id}">1</td>  
    30.             <td th:text="${#calendars.format(message.created)}">  
    31.               July 11, 2012 2:17:16 PM CDT  
    32.             </td>  
    33.             <td>  
    34.               <href="view.html"  
    35.                   th:href="@{'/' + ${message.id}}"  
    36.                   th:text="${message.summary}">  
    37.                 The summary  
    38.               </a>  
    39.             </td>  
    40.           </tr>  
    41.         </tbody>  
    42.       </table>  
    43.     </div>  
    44.   </body>  
    45. </html>  

     view.html代码如下:

    Html代码  
    1. <html xmlns:th="http://www.thymeleaf.org"  
    2.   xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"  
    3.   layout:decorator="layout">  
    4.   <head>  
    5.     <title>Messages : View</title>  
    6.   </head>  
    7.   <body>  
    8.     <h1 layout:fragment="header">Messages : Create</h1>  
    9.     <div layout:fragment="content"  
    10.         class="container">  
    11.       <div class="alert alert-success"  
    12.           th:if="${globalMessage}"  
    13.           th:text="${globalMessage}">  
    14.         Some Success message  
    15.       </div>  
    16.       <div class="pull-right">  
    17.         <th:href="@{/}" href="list.html">  
    18.           Messages  
    19.         </a>  
    20.       </div>  
    21.       <dl>  
    22.         <dt>ID</dt>  
    23.         <dd id="id" th:text="${message.id}">123</dd>  
    24.         <dt>Date</dt>  
    25.         <dd id="created"  
    26.             th:text="${#calendars.format(message.created)}">  
    27.           July 11, 2012 2:17:16 PM CDT  
    28.         </dd>  
    29.         <dt>Summary</dt>  
    30.         <dd id="summary"  
    31.             th:text="${message.summary}">  
    32.           A short summary...  
    33.         </dd>  
    34.         <dt>Message</dt>  
    35.         <dd id="text"  
    36.             th:text="${message.text}">  
    37.           A detailed message that is longer than the summary.  
    38.         </dd>  
    39.       </dl>  
    40.     </div>  
    41.   </body>  
    42. </html>  

     注th标签的引用就是首先要注入标签头,xmlns:th="http://www.thymeleaf.org"放入html标签内就可以了,

    # 代表 获取对象 从 messages bundle 也就是消息的资源本地化文件

    $ 表示从model里面获取

    Html代码  
    1. <div class="col-sm-9">  
    2.        <input type="text" th:field="*{id}" placeholder="Order Id" class="col-xs-10 col-sm-5" />  
    3.                <style="color:red" th:if="${#fields.hasErrors('*{id}')}" th:errors="*{id}"></p>  
    4.  </div>  

     th:fragment=“public” 相当于 include标签

    th:each="user : ${users}" 相当于c:foreach  使用时候

    如上面

    <tr th:each="user : ${users}">

    <td th:text="${user.id}">01</td>

    <td th:text="${user.name}">朱遇平</td>

    <td th:text="${user.xx}">java</td>

    <td th:text="${user.xx}">程序员</td>

    </tr>

    th:href="@{/}"动态设置url参数

    <form action="#" th:action="@{/users/add}" th:object="${myuser}" method="post">

    这里th:Object表示表单与 改myuser注入的实体映射,

    在表单 th:field="*{id} 则表示 该表单的值 与 myuser的id绑定 

    th:if="${#fields.hasErrors('*')}"

    th:if="${#strings.isEmpty(status)}"

    ${not #strings.isEmpty(status)}

    if判断显示。

    Html代码  
    1. <div class="col-sm-9">  
    2.    <input type="text" th:field="*{id}" placeholder="Order Id" class="col-xs-10 col-sm-5" />  
    3.    <style="color:red" th:if="${#fields.hasErrors('*{id}')}" th:errors="*{id}"></p>  
    4. </div>  

     th:errors错误信息显示如上图。

  • 相关阅读:
    Xcode 5.1 更新后插件不能用
    adplus 抓取dump
    压力测试工具 Tinyget
    mssql server提示无权限
    windbg sos加载相关
    oracle中文显示为问号
    菜鸟成长进阶之——fiddler使用总结
    windbg学习进阶之——windbg字段名及其意义
    windbg学习进阶之——dump分析常用命令收集
    windbg学习进阶之——windbg环境变量配置
  • 原文地址:https://www.cnblogs.com/HHR-SUN/p/7096374.html
Copyright © 2011-2022 走看看