For循环HubL中的对象数组？答案

【问题标题】：For loop an array of objects in HubL?For循环HubL中的对象数组？
【发布时间】：2016-10-31 16:17:39
【问题描述】：

您好，我有一些 javascript 将 HTML 代码生成到 hubspot，我的客户希望更轻松地访问编辑内容，我正在尝试使用 HubL 模板进行设置。我发现我可以使用 for 循环来打印数组变量，但我很好奇我是否能够打印对象数组？

他们的代码：

{% set languages = ['HTML', 'CSS', 'Javascript', 'Python', 'Ruby', 'PHP,', 'Java'] %}

{% for language in languages %}
 <li>{{ language }}</li>
{% endfor %}

我的代码的简化版本：

  { % set episodes = [{
        id: "1",
        name: "Episdoe 1"
    }, {
        id: "2",
        name: "Episdoe 2"
    }, {
        id: "3",
        name: "Episdoe 3"
    }, {
        id: "4",
        name: "Episdoe 4"
    }]
%}

<ul>{% for episode in episodes %}
  <li>{{ episode.id }}</li> 
  <li>{{ episode.name}}</li> 
  {% endfor %}
</ul>

我目前因语法错误而收到错误消息。错误来自 [] 中的括号。我已经尝试在他们的网站上查看并进行了一些谷歌搜索，但我似乎找不到任何关于显示对象数组的内容。

【问题讨论】：

您的代码格式不正确：(1) id 键值对之后的对象数组中缺少逗号。 (2) 额外的 } 在您的数组之后和关闭您的 {% set %} 语句之前
好的，我会解决这个问题，但这些实际上是我为了示例而进行的更改。当我只是列出 set episodes = [{ id: "1"}, {id: "2"} ... }] 时，代码在这些更改之前不起作用。
对不起，你是对的，最后我有一个额外的 } 语法错误，这破坏了我的代码。感谢您的帮助:)

标签： html jinja2 hubspot

【解决方案1】：

应该工作！这是一个功能性 HubL 模板示例，使用您在上面提供的对象/数据（带有修复）：

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>{{ content.html_title }}</title>
    <meta name="description" content="{{ content.meta_description }}">
    {{ standard_header_includes }}
</head>
<body>
    {% set episodes = [
        {
            id: "1",
            name: "Episdoe 1"
        }, 
        {
            id: "2",
            name: "Episdoe 2"
        }, 
        {
            id: "3",
            name: "Episdoe 3"
        }, 
        {
            id: "4",
            name: "Episdoe 4"
        }
    ] %}

    <ul>{% for episode in episodes %}
      <li>{{ episode.id }}</li> 
      <li>{{ episode.name}}</li> 
      {% endfor %}
    </ul>

    {{ standard_footer_includes }}
</body>
</html>

【讨论】：

谢谢柯克！如果你不介意，另一个快速的问题。我能否实现这一点，以便让我的客户从“编辑页面”页面添加对象？所以我可以将其设置为像 {% set episodes = [{ id: (id), name: (episode) } 之类的变量，显然，我的语法是错误的，但我希望能够将所有这些信息嵌套在页面编辑中，所以我的客户不必通过这段代码来添加额外的剧集。