在 html/template 中循环遍历 GoLang 中的数组元素

Looping through array elements in GoLang in the html/template

我有一个 Go 网络服务器,我想在其中显示 JSON 文件的内容..

main.go 读取文件并将数据放入结构中。当我直接循环遍历结构中的数据时,我可以像这样在终端中打印数据:

第 1 组

成员 1

会员2

会员3

第 2 组

成员 1

会员2

会员3

这是我想要的 html 以便我可以设计它。

当我将数据发送到模板时,我得到以下内容

第 1 组

[会员 1 会员 2 会员 3]

第 2 组

[会员 1 会员 2 会员 3]

在我看来,GroupMembers 是作为一个字符串传入的。我想知道如何让模板将它们作为单独的元素读取,以便我可以添加 html(例如 <br>)。

我的代码由以下 3 个文件组成。

main.go 文件:

package main

import (
    "bytes"
    "encoding/json"
    "fmt"
    "html/template"
    "io/ioutil"
    "net/http"

    "github.com/dimchansky/utfbom" //used for removing BOM from utf-8
)

//import struct
type dataStruct struct {
    GroupName    string   `json:"name"`
    GroupMembers []string `json:"Members"`
}

type Request struct {
}

//File path
const jsonImport = "./static/JSONFiles/OUdata.json"

func main() {

    http.HandleFunc("/", pageHandler)
    http.ListenAndServe(":2323", nil)
}

func pageHandler(w http.ResponseWriter, r *http.Request) {
    //read file
    theJson, err := ioutil.ReadFile(jsonImport)
    if err != nil {
        fmt.Print(err)
    }
    //get rid of BOM
    data, err := ioutil.ReadAll(utfbom.SkipOnly(bytes.NewReader(theJson)))
    if err != nil {
        fmt.Println(err)
        return
    }

    //make a new struct
    var theData []dataStruct

    //put the JSON into a struct
    err = json.Unmarshal(data, &theData)
    if err != nil {
        fmt.Println("error!!", err)
    }

    //loop through and print JSON in terminal
    for i := 0; i < len(theData); i++ {
        fmt.Println(theData[i].GroupName)
        for j := 0; j < len(theData[i].GroupMembers); j++ {
            fmt.Println(theData[i].GroupMembers[j])
        }

    }
    //Print test of 1 GroupMember in terminal
    fmt.Println(theData[0].GroupMembers[1])

    p := theData
    t, _ := template.ParseFiles("rolegrouppage.html")
    t.Execute(w, p)
}

html模板文件(rolegrouppage.html):

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hiya Buddy!</title>
</head>
<body>
  {{range .}}
  <h1>
    {{.GroupName}}
</h1>

<h4>
  
  {{.GroupMembers}}
  
</h4> 

{{end}}

</body>
</html>

和数据文件(OUdata.json):

[
    {
        "name":  "Group 1",
        "Members":  [
                        "Mrs Smith",
                        "Ms Sigmundsdottir",
                        "Mr Arnason"
                    ]
    },
    {
        "name":  "Group 2",
        "Members":  [
                        "Mrs Gunnarsdottir",
                        "Mr Bjarnason",
                        "Ms Sturludóttir",
                        "Mrs Grímsdóttir",
                        "Mr Rafnkelsson"
                    ]
    }
]

实现此目的的最佳方法是否是重新格式化 JSON 文件并以某种方式以不同方式循环?或者有没有办法从 html/template?

访问每个“元素”

您需要 range 遍历 GroupMembers 字段,就像您遍历 theData 值一样。

<body>
{{ range . }}
  <h1>{{ .GroupName }}</h1>
  {{ range .GroupMembers }}
  <h4>{{ . }}</h4>
  {{ end }}
{{ end }}
</body>