Question

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

我知道

'{{ index .Array 0}}'

工作并从数组中提取第一个元素。但我想做一个Javascript for循环并打印数组中的每个元素，如此

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

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

但这不起作用。关于分离go数组索引字符串，HTML / Javascript并不喜欢它并且它不会加载的东西。

这是一个语法错误，我无法确定。

有什么想法吗？

Answer 1

你需要了解一些事情：

{{index .Array 0}}等模板操作在Go应用程序的服务器端执行。

Javascript代码在浏览器中的客户端侧进行解释和运行。

模板操作中使用的模板参数值（示例中为Array）在客户端不存在（例如，作为Javascript对象）。模板引擎无法运行Javascript代码。所以模板参数（值）和Javascript（执行）存在于2个不同的“空格”中。

话虽如此，却无法混合模板动作/变量和Javascript执行。

您有两个选择：

1）做你想做的模板动作。

2）使用模板创建Javascript代码，在客户端执行时，将构建/重新创建数组作为Javascript对象，以便进一步的Javascript处理。

请注意，如果您只想循环遍历数组一次，则无需创建Javascript数组，您只需在{{range}}模板操作中呈现将成为循环体的JavaScript代码。请参阅Simon's answer作为示例。

阐述＃1

您可以使用{{range .Array}}操作循环Array，并为每个元素执行块，管道设置为数组元素，以便您可以输出如下数组元素：

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

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

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

阐述＃2

假设您的Array包含int个数字，您可以在Javascript中重新创建它，并使用以下模板在Javascript中循环它：

<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数组，因此您只需编写：

<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>

Answer 2

你没有＆＃34;将Golang阵列传递到前端＆＃34; ..您的模板正在呈现服务器端。这是一个重要的区别。

当你这样想的时候......句法问题就变得清晰了。您正试图在表达式中间使用Javascript混合使用Go的模板语法。这根本不正确。您应该使用Go循环，该循环在渲染时生成有效的Javascript以供客户端使用：

var javaScriptHtmlVariable = "";

{{ range .Array }}
    javaScriptHtmlVariable += '{{.}}';
{{ end }}

会呈现：

javaScriptHtmlVariable += 'One';
javaScriptHtmlVariable += 'Two';
javaScriptHtmlVariable += 'Three';
javaScriptHtmlVariable += 'Four';
// etc..

在Javascript中引用Go数组

2 个答案:

阐述＃1

阐述＃2