在 Javascript 中引用 Go 数组 [英] Referencing Go array in Javascript

问题描述

我有一个 Golang 数组，我要传递给前端的 html 文件.

I have a Golang array I'm passing to my html file on the front end.

我知道

'{{ index .Array 0}}' 

工作并从数组中拉出第一个元素.但我想做一个 Javascript for 循环并像这样打印数组中的每个元素

works and pulls the first element from the array. But I want to do a Javascript for-loop and print every element in the array like so

<script type="text/javascript">
function loop() {

    html = ""
    for(var i = 0; i<5; i++) {
        html += "{{ index .Array " + i + "}}";
      }
}

但这行不通.关于分离 go 数组索引字符串，HTML/Javascript 不喜欢它，它不会加载.

But this doesn't work. Something about separating the go array index string, HTML/Javascript doesn't like it and it won't load.

这是一个我无法确定的语法错误.

It's a syntactical error that I just can't pin down.

有什么想法吗?

推荐答案

你需要了解一些东西:

诸如 {{index .Array 0}} 之类的模板操作在 Go 应用程序的服务器端执行.

Template actions such as {{index .Array 0}} are executed at server side in your Go application.

Javascript 代码在浏览器的客户端端被解释和运行.

Javascript code is interpreted and run at client side in the browser.

模板操作中使用的模板参数值(在您的示例中为 Array)在客户端不存在(例如作为 Javascript 对象).模板引擎不运行 Javascript 代码.因此模板参数(值)和 Javascript(执行)存在于 2 个不同的空间"中.

The template parameter value used in template actions (Array in your example) does not exist at client side (e.g. as a Javascript object). And Javascript code is not run by the template engine. So the template parameter (value) and Javascript (execution) live in 2 different "spaces".

话虽如此，模板动作/变量和 Javascript 执行不可能混合使用.

Having said that, it is not possible to mix template actions/variables and Javascript execution.

您有两个选择:

1) 用模板动作做你想做的事.

1) Do what you want to do with template actions.

2) 使用模板创建 Javascript 代码，当在客户端执行时，该代码会将数组构造/重新创建为 Javascript 对象，以便它可用于进一步的 Javascript 处理.

2) Use the template to create Javascript code which when executed at the client side will construct/recreate the array as a Javascript object so it will be available for further Javascript processing.

请注意，如果您只想遍历数组一次，则不需要创建 Javascript 数组，您可以简单地将 JavaScript 代码呈现为 {{range}} 模板操作.以西蒙的回答为例.

Note that if you just want to loop over the array once, creating a Javascript array is not neccessary, you can simply render the JavaScript code that would be the loop body inside a {{range}} template action. See Simon's answer as an example to this.

你可以使用{{range .Array}}动作来循环Array，对每个元素执行block，pipeline设置为数组元素所以您可以像这样输出数组元素:

You can use the {{range .Array}} action to loop over Array, and the block is executed for each element, pipeline set to the array element so you can output the array elements like this:

{{range .Array}}
    {{.}}
{{end}}

当然，您可以在块中放入任何其他内容，而不仅仅是数组元素.您甚至可以像这样访问当前索引:

Of course you can put anything else inside the block, not just the array elements. You can even access the current index like this:

{{range $idx, $value := .Array}}
    Index = {{$idx}}; Element = {{$value}}<br>
{{end}}

详细说明#2

假设您的 Array 包含 int 数字，您可以在 Javascript 中重新创建它并在 Javascript 中使用这样的模板循环遍历它:

Elaborating #2

Let's say your Array contains int numbers, you can recreate it in Javascript and loop over it in Javascript with a template like this:

<script>
    var arr = [
        {{range .Array}}
            {{.}},
        {{end}}
    ];

    // Now you have a javascript array: arr, loop over it to do something:
    html = "";
    for(var i = 0; i < arr.length; i++) {
        html += " " + arr[i];
    }
</script>

或者由于模板引擎支持将数组和切片渲染"为 JavaScript 数组，您可以简单地编写:

Or since the template engine supports "rendering" arrays and slices as JavaScript arrays, you can simply write:

<script>
    var arr = {{.Array}};

    // Now you have a javascript array: arr, loop over it to do something:
    html = "";
    for(var i = 0; i < arr.length; i++) {
        html += " " + arr[i];
    }
</script>

这篇关于在 Javascript 中引用 Go 数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！