第六章：thymeleaf页面模版-4. 对象输出

时间 2019-11-13

标签第六 thymeleaf 页面模版对象输出繁體版

原文原文链接

在实际的开发之中常常面对页面要显示对象内容的处理操做,因而下面来观察一下如何进行对象信息的输出javascript

1.准备一个VO类html

package cn.mldn.microboot.vo;

import java.io.Serializable;
import java.util.Date;

@SuppressWarnings("serial")
public class Member implements Serializable {
	private Long mid ;
	private String name ;
	private Integer age ;
	private Date birthday ;
	private Double salary ;
	public Long getMid() {
		return mid;
	}
	public void setMid(Long mid) {
		this.mid = mid;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public Integer getAge() {
		return age;
	}
	public void setAge(Integer age) {
		this.age = age;
	}
	public Date getBirthday() {
		return birthday;
	}
	public void setBirthday(Date birthday) {
		this.birthday = birthday;
	}
	public Double getSalary() {
		return salary;
	}
	public void setSalary(Double salary) {
		this.salary = salary;
	}
}

2.编写一个控制器将对象内容进行属性传递java

package cn.mldn.microboot.controller;

import java.util.Date;

import javax.servlet.http.HttpServletRequest;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

import cn.mldn.microboot.util.controller.AbstractBaseController;
import cn.mldn.microboot.vo.Member;

@Controller
public class MessageController extends AbstractBaseController {
	@RequestMapping(value = "/message/member_show", method = RequestMethod.GET)
	public String memberShow(Model model) {
		Member vo = new Member();
		vo.setMid(101L);
		vo.setName("啊三");
		vo.setAge(9);
		vo.setSalary(99999.99);
		vo.setBirthday(new Date());
		model.addAttribute("member", vo);
		return "message/member_show";
	}
}

3.编写一个具体的页面进行输出web

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>SpringBoot模版渲染</title>
	<script type="text/javascript" th:src="@{/js/main.js}"></script> 
	<link rel="icon" type="image/x-icon" href="/images/mldn.ico"/>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
</head>
<body>
	
		<p th:text="'用户编号：' + ${member.mid}"/>
		<p th:text="'用户姓名：' + ${member.name}"/>
		<p th:text="'用户年龄：' + ${member.age}"/>
		<p th:text="'用户工资：' + ${member.salary}"/>
		<p th:text="'出生日期：' + ${member.birthday}"/>
		<p th:text="'出生日期：' + ${#dates.format(member.birthday,'yyyy-MM-dd')}"/>
	
</body>
</html>

4.如今程序编写到此处能发现一个小小的问题，若是要如今按照此类方式进行输出，咱们会以为这个操做太麻烦了，有一种更简单的作法:spring

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>SpringBoot模版渲染</title>
	<script type="text/javascript" th:src="@{/js/main.js}"></script> 
	<link rel="icon" type="image/x-icon" href="/images/mldn.ico"/>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
</head>
<body>
	<div th:object="${member}">
		<p th:text="'用户编号：' + *{mid}"/>
		<p th:text="'用户姓名：' + *{name}"/>
		<p th:text="'用户年龄：' + *{age}"/>
		<p th:text="'用户工资：' + *{salary}"/>
		<p th:text="'出生日期：' + *{birthday}"/>
		<p th:text="'出生日期：' + *{#dates.format(birthday,'yyyy-MM-dd')}"/>
	</div>
</body>
</html>

区别:关于"${属性}"和"*{属性}"区别?app

这两种属性访问机制在访问单独或者是完整属性时候是同样的，而若是要使用"*{}"形式进行访问每每须要结合"th:object"做为总体对象的声明后，才能够访问属性。ui

$访问完整信息，而*访问指定对象中的属性内容，若是访问的只是普通的内容二者没有区别。this