gin架构下实现页面的数据调用

package  main

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



func main() {
	r := gin.Default()
	//r.LoadHTMLFiles("/temp/hello01.html")
	r.LoadHTMLGlob("temp/**/*") // **/代表一个文件级
	//指定cSS文件
	r.Static("/s","style")  //css文件需要使用相对路径
   //r.StaticFS("/s",http.Dir("static")) 另外一种引入CSS路径的映射方式
	//r.GET("/demo02",myfunc.Hello )  //定义路径下页面,通配,页面需要加
	//r.GET("/demo02",myfunc.Hello2 )
	r.GET("/demo02",myfunc.Hello07)
	// define end标签



	r.Run()

	}

函数单独写一个页面

package myfunc

import "github.com/gin-gonic/gin"

func Hello(context *gin.Context) {
	//context.String(300,"这是我的第一个gin")
	name := "你好我是golang"   //将要渲染的字符串传入,在页面上使用上下文获取{{.}}

	context.HTML(200,"demo02/hello02.html",name)
	//加载的html路径
}

type Student struct {
	Name string
	Age int64
}
func Hello2(context *gin.Context) {
     s := Student{
     	Name:  "goland" ,
     	Age: 2018,

 	 }
     context.HTML(300,"demo02/hello02.html",s)
}

func Hello3(context *gin.Context)  {
	var  arr [3]int
	arr[0] = 10
	arr[1] = 20
	arr[2] = 30
	context.HTML(400,"demo02/hello02.html",arr)
}
func  Hello5(context *gin.Context){

	var a  map[string]int = make(map[string]int,3)
	a ["lili"] = 18
	a["菲菲"] =12
	a["毛毛"] =3

	context.HTML(200,"demo02/hello02.html",a)

}
func  Hello6(context *gin.Context)  {
	var a  map[string]Student = make(map[string]Student,3)
	a["No1"]= Student{
		Name:"毛毛",
		Age: 2,

	}
	a["No2"]= Student{
		Name:"菲菲",
		Age:21,
	}
	context.HTML(200,"demo02/hello02.html",a)
}

func Hello07(context *gin.Context)  {
	 slice := []int{1,2,3,4,5}

	context.HTML(200,"demo02/hello02.html",slice)
}

网页样式写一个页面

{{ define  "demo02/hello02.html"}}
<!DOCTYPE html>
<html lang="en">
<link>
    <meta charset="UTF-8">
    <title>Title</title>
    <link  rel="stylesheet" href="/s/css/mycss.css">
 <body>
 这是hello02的页面
 <span> 这部分我想要红色</span>
 {{/*<span  style="color: red">   这部分我想要红色 </span>*/}}
 {{/*{{.Name}}<br>*/}}
 {{/*{{.Age}}*/}}
 {{/*{{range .}}*/}}
     {{/*第一个点代表的是传入的数组的上下文,第二个点代表的变量的数组的上下文*/}}
      {{/*{{.}}*/}}
 {{/*{{end}}*/}}

     {{/*第二种方式,带下标*/}}
     {{/*{{range  $i,$v := .}}*/}}
       {{/*{{$i}}*/}}
         {{/*{{$v}}*/}}
     {{/*{{end}}*/}}
{{/*获取map中的内容,通过key获取value*/}}
{{/*{{.lili}}*/}}
 {{/*{{.毛毛}}*/}}
{{/*.是上下文,key得到value*/}}
{{/*{{.No1.Name}}*/}}
 {{/*{{.No2.Age}}*/}}
 {{range .}}
   {{.}}
 {{end}}
{{range $i ,$v := .}}
 {{$i}}
 {{$v}}
 {{end}}




</body>

</html>
{{end}}
这是hello02的页面 这部分我想要红色 1 2 3 4 5 0 1 1 2 2 3 3 4 4 5

运行结果,数组和切片可以通过{{rang ,}} {{.}}{{end}} 来实现遍历

其他如 map,struct可以使用键值对

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值