在Nunjucks中循环遍历对象？

Question

我有一个名为“list.json”的文件，格式如下：

{
  "thing1": "Thing1",
  "thing2": "Thing2",
  "thing3": "Thing3"
}

我该如何循环处理这个内容？我想做的事情类似于：

{% for item in list%}
  <option>{{ thing }}</option>
{% endfor %}

- j_d

---

可能是Loop through object properties nunjucks的重复问题。 - KyleMit

Answer 1

你可以尝试以下方法：

{% for key, item in list%}
  <option>{{ item }}</option>
{% endfor %}

- Nikhil Aggarwal

---

它没有循环任何东西。什么也没有显示出来。默默失败。 - j_d

你能够操作 list 吗？我的意思是说，它是否有对象或者可能 list 没有被正确设置？ - Nikhil Aggarwal

你的意思是绘图吗？ - j_d

@JohnDoe - 我的意思是在浏览器中显示，也就是当你写 {{list}} 时看到了什么？ - Nikhil Aggarwal

Answer 2

您是否已经导入了JSON？如果没有，在渲染JS中添加一个变量：

list: JSON.parse(fs.readFileSync('list.json'))

如果您需要多次使用它，请在文件顶部添加一个变量。

var LIST = JSON.parse(fs.readFileSync('list.json'))

你也可以使用异步方法，但需要一些嵌套：

fs.readFile('list.json', function(err, list) {
    env.render('template.html', {
        list: list,
        //other data
    }
}

- somebody

Answer 3

如果您正在使用Gulp，这可以帮助您：http://www.zell-weekeat.com/nunjucks-with-gulp#Populating-HTML-with-data。

- Emanuel Saramago

Answer 4

首先，在后端创建一个对象数组：

var things = [];

things.push({id : 'thing1', name : 'Thing1'});
things.push({id : 'thing2', name : 'Thing2'});
things.push({id : 'thing3', name : 'Thing3'});

现在在前端，您可以像下面这样循环遍历此数组：

{% for thing in things %}
<option value="{{ thing.id }}"> {{ thing.name }}</option>
{% endfor %}

希望这能对你有所帮助。

- Ankit