getting started with templates in gin framework

helva

已于 2022-11-04 09:02:50 修改

阅读量67

点赞数

文章标签： java 前端 html

于 2022-11-04 08:55:36 首次发布

本文链接：https://blog.csdn.net/helva/article/details/127681977

版权

Using the gin framework,return string types,JSON types,XML types ,struct types,JSONP type data.
the use of template and template syntax
Access mysql using the ORM package

the use of template and template syntax

#The first template exercise

#1.Create main.go

package main

import (
	"github.com/gin-gonic/gin"
	"net/http"
)

func main() {
	r := gin.Default()
	//Configure template engine to load everything in the template
	//r.loadHTMLFiles("templates/template1.html","templates/template2.html")
	//r.LoadHTMLGlob("templates/**/*")
	r.LoadHTMLGlob("template/*")
	//Render templates using the gin framework
	//Note: r.LoadHTMLGlob ("templates/*") needs to be configured
	//Use custom templates in gin and render background data to templates
	r.GET("/template", func(c *gin.Context) {
		c.HTML(http.StatusOK, "index.html", gin.H{
			"title": "Bind the background data to the front-end template, and then render it",
		})
	})
	r.Run(":8088")
}

#Create template/index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<!--Bind the back-end title data return value to the front end-->
  {{.title}}
</body>
</html>

#Execute:

go run main.go

//Execute result:
//Listening and serving HTTP on :8088
//[GIN] 2022/11/03 - 11:29:51 | 200 |    1.019759ms |       127.0.0.1 | GET      //"/template"

 curl http://localhost:8088/template

// Bind the background data to the front-end template, and then render it

#2.Template group exercise

~~Template rendering and template Syntax of gin Framework~~

#How to render multiple groups of templates to the front end?

#Modify the parameters introduced into the template engine

r.LoadHTMLGlob("templates/**/*")

#Declare in the template file that the template group to which the template belongs
default/index.html

{{define "templates/news/index.html"}}
    Template content
{{end}}

create templates/news/index.html

{{define "news/index.html"}}

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<ul>
    {{range $key,$value:=.newsList}}
    <li>{{$key}}:{{$value.Title}}</li>
    <li>{{$key}}:{{$value.Content}}</li>
    {{end}}
</ul>
</ul>
</body>
</html>
{{end}}

#Create main.go

package main

import (
	"github.com/gin-gonic/gin"
	"net/http"
)

type Article struct {
	Title   string `json:"title"`
	Content string `json:"content"`
}

func main() {
	r := gin.Default()
	//Configure template engine to load everything in the template
	//r.loadHTMLFiles("templates/template1.html","templates/template2.html")
	//r.LoadHTMLGlob("templates/**/*")
	r.LoadHTMLGlob("templates/**/*")
	//Render templates using the gin framework
	//Note: r.LoadHTMLGlob ("templates/*") needs to be configured
	//Use custom templates in gin and render background data to templates
	r.GET("/news", func(c *gin.Context) {
		c.HTML(http.StatusOK, "news/index.html", gin.H{
			"newsList": []interface{}{
				&Article{
					Title:   "news title1",
					Content: "news content1",
				},
				&Article{
					Title:   "news title2",
					Content: "news content2",
				},
			},
			"hobby": []string{"eatting", "sleeping", "write code", "meditate"},
		})
	})
	r.Run(":8088")
}

#Execute:

go run main.go

//Execute result:
//Listening and serving HTTP on :8088
//[GIN] 2022/11/03 - 13:02:17 | 200 |     727.271µs |       127.0.0.1 | GET      //"/news"
//[GIN] 2022/11/03 - 13:03:01 | 200 |     739.325µs |       127.0.0.1 | GET      //"/news"

curl http://localhost:8088/news

//Execute result:
//0:{news title1 news content1} 1:{news title2 news content2}
//0:news title1
//0:news content1
//1:news title2
//1:news content2