Add Spring-boot-starter-thymeleaf Dependency
2. Add a static file1 < dependency > 2 < GroupId > org.springframework.boot </ groupid > 3 < artifactid Span style= "COLOR: #0000ff" >> spring-boot-starter-thymeleaf</ Span style= "COLOR: #800000" >artifactid > 4 </ Dependency >
According to spring boot default rules, scripts and styles are placed by default under Src/main/resources/static, and I introduce Metro-bootstrap-master (an open source template)
Structure:
3. Presentation of HTML pagesDepending on the spring boot default rule, the page is placed under Src/main/resources/templates, or you can customize the path in Application.properties.
1 ########################################################2 # # #THYMELEAF (thymeleafautoconfiguration)3 ########################################################4 #spring. thymeleaf.prefix=classpath:/templates/5 #spring. thymeleaf.suffix=.html6 #spring. THYMELEAF.MODE=HTML57 #spring. Thymeleaf.encoding=utf-88 #spring. thymeleaf.content-type=text/html9 # set to False for hot refreshTen OneSpring.thymeleaf.cache=false
The specific HTML code is as follows:
<HTMLxmlns:th= "http://www.thymeleaf.org"> <Head> <Metacontent= "Text/html;charset=utf-8" /> <Metahttp-equiv= "X-ua-compatible"content= "Ie=edge"/> <Metaname= "Viewport"content= "Width=device-width, initial-scale=1"/> <LinkTh:href= "@{css/metro-bootstrap.min.css}"rel= "stylesheet"/> <LinkTh:href= "@{css/font-awesome.min.css}"rel= "stylesheet"/> <LinkTh:href= "@{css/docs.css}"rel= "stylesheet"/> </Head> <Body> <Divclass= "Grid"> <Divclass= "Row col-md-12"> <Divclass= "Tile tile-clouds col-md-3 col-xs-12" > <H1Th:text= "${s[0]}"></H1> </Div> <Divclass= "Tile Tile-emerald col-md-3 col-xs-12" > <H1Th:text= "${s[1]}"></H1> </Div> <Divclass= "Tile tile-turquoise col-md-3 col-xs-12" > <H1Th:text= "${s[2]}"></H1> </Div> <Divclass= "Tile tile-amethyst col-md-3 col-xs-12" > <H1Th:text= "${s[3]}"></H1> </Div> </Div> </Div> </Body> <Scriptth:src= "@{js/jquery/jquery.min.js}"></Script> <Scriptth:src= "@{js/bootstrap/bootstrap.min.js}"></Script> <Scriptth:src= "@{js/metro-docs.js}"></Script> <ScriptTh:inline= "JavaScript"> vars=[[${s}]; Console.log (s); </Script></HTML>4. Views and data
Create a new controller, create a new array to return the data with the following code:
PackageCom.haq.web;ImportOrg.springframework.stereotype.Controller;ImportOrg.springframework.ui.Model;Importorg.springframework.web.bind.annotation.RequestMapping;@Controller @requestmapping ("/") Public classSamplecontroller {@RequestMapping ("/index") PublicString Index (model model) {string[] s= {"I am 1", "I am 2", "I am 3", "I am 4"}; Model.addattribute ("S", s); return"Index"; }}5. Running
Start spring boot, return http://127.0.0.1:8080/index, Effect:
PostScript: Welcome to Exchange Study, there are problems also look at a lot of advice, O (∩_∩) o Thank you.
Spring Boot Learning notes-Integration Thymeleaf
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
