go语言中的模版语法

golang的模版语法，如何模块化编程，网上教程大部分都是如何解析模版，但是如何构建前后端项目很少。

基础教程

golang template 页面的内容
基础的教程大家可以参考李文周的博客，其他基础的博客内容也可以参考。
https://www.liwenzhou.com/posts/Go/go_template/

tmpl, _ := template.New("").Parse("<h1>{{.}}</h1>") 
tmpl, _ := template.ParseFiles("demo.html")  

tmpl.Execute(w, "Hello world")

web项目中使用

web的主要结构

在这里插入图片描述

先说下html当中的结构

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>{{.title}}</title>
</head>

<body>
The content of the document......
</body>

</html>

标签	描述
<head>	定义关于文档的信息。
<title>	定义文档标题。
<base>	定义页面上所有链接的默认地址或默认目标。
<link>	定义文档与外部资源之间的关系。
<meta>	定义关于 HTML 文档的元数据。
<script>	定义客户端脚本。
<style>	定义文档的样式信息。

template

构造页面的两种方式

方法一

这种方式直接将页面按照页面结构处理

header.html

{{define "common/header"}}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>{{.title}}</title>
</head>
    <body>
{{end}}

footer.html

{{define "common/footer"}}
</body>
</html>
{{ end }}

body.html

content主体内容

{{ define "user/index.html" }}
{{template "common/header" .}}
        {{.content}}
{{template "common/footer" .}}
{{ end }}

tmpl, _ := template.ParseFiles(“header.html”, “footer.html”, “profile.html”)
tmpl.Execute(w, User{Name: “yunweigo”})

方案二模版方法

类似django当中的模版语法

layout.html

<!-- layout.html -->
<html>
    <body>
        <div class="navbar">...</div>
        <div class="content">
            {{block "content" .}}
                <!-- Fallback, if "content" is not defined elsewhere -->
            {{end}}
        </div>
    </body>
</html>

content.html

<!-- content.html -->
{{define "content"}}
<div class="content">
    Your username: {{.User.Name}}
</div>
{{end}}

go view

tmpl, _ := template.ParseFiles("layout.html", "content.html")
tmpl.Execute(w, User{Name: "yunweigo"})

index.html

<!-- index.html -->
<html>
    <head>
        <title>{{block "title"}}Default page title{{end}}</title>

        <script src="app.js"></script>
        {{block "additional_scripts"}}{{end}}
    </head>
    <body>
        <div class="navbar">...</div>
        <div class="content">
            {{block "content" .}}
                <!-- Fallback, if "content" is not defined elsewhere -->
            {{end}}
        </div>
    </body>
</html>

gin框架下面的使用

学习gin框架下面如何使用模版构建页面

Learn how to use Gin to build a web application,
Understand the parts of a web application written in Go, and
Learn how to use Semaphore Continuous Integration to test and build the application quickly and safely.

导航模块 template/html

<!--menu.html-->

<nav class="navbar navbar-default">
  <div class="container">
    <div class="navbar-header">
      <a class="navbar-brand" href="/">
        Home
      </a>
    </div>
  </div>
</nav>

header页面

public/header.html

<!--header.html-->

<!doctype html>
<html>

  <head>
    <!--Use the title variable to set the title of the page-->
    <title>{{ .title }}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8">

    <!--Use bootstrap to make the application look nice-->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
    <script async src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  </head>

  <body class="container">
    <!--Embed the menu.html template at this location-->
    {{ template "menu.html" . }}

menu.html

<nav class="navbar navbar-default" role="navigation">
    <div class="container-fluid">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">yunweigo</a>
    </div>
    <div>
        <ul class="nav navbar-nav">
            <li class="active"><a href="#">Gin router</a></li>
            <li><a href="#">Gin view</a></li>
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    html
                    <b class="caret"></b>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="#">header</a></li>
                    <li><a href="#">body</a></li>
                </ul>
            </li>
        </ul>
    </div>
    </div>
</nav>

footer 页面

<!--footer.html-->

  </body>

</html>

构建index页面

<!--index.html-->

<!--Embed the header.html template at this location-->
{{ template "header.html" .}}

  <h1>Hello Gin!</h1>

<!--Embed the footer.html template at this location-->
{{ template "footer.html" .}}

定义define handler

router.GET("/", func(c *gin.Context) {
  c.HTML(
      // 设置状态码为 200 (OK)
      http.StatusOK,
      // 用index.html展示
      "index.html",
      // 在页面中使用的数据
      gin.H{
          "title": "Home Page",
      },
  )

})

启动运行

router.Run()

完整代码段

目录结构

├── main.go
└── templates
    ├── footer.html
    ├── header.html
    ├── index.html
    └── menu.html

package main

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

var router *gin.Engine

func main() {

  // Set the router as the default one provided by Gin
  router = gin.Default()

  // Process the templates at the start so that they don't have to be loaded
  // from the disk again. This makes serving HTML pages very fast.
  router.LoadHTMLGlob("templates/*")

  // Define the route for the index page and display the index.html template
  // To start with, we'll use an inline route handler. Later on, we'll create
  // standalone functions that will be used as route handlers.
  router.GET("/", func(c *gin.Context) {

    // Call the HTML method of the Context to render a template
    c.HTML(
      // Set the HTTP status to 200 (OK)
      http.StatusOK,
      // Use the index.html template
      "index.html",
      // Pass the data that the page uses (in this case, 'title')
      gin.H{
        "title": "Home Page",
      },
    )

  })
  // Start serving the application
  router.Run()
}