在nunjucks中循环遍历对象时如何限制迭代次数

Question

我有一个这样的 js 对象：

var data = [
    { src: "src1", name: "name 1" }, 
    { src: "src2", name: "name 2" }, 
    { src: "src3", name: "name 3" }
]

我正在用 Nunjucks 遍历它：

{% for object in data %}
    {{object.src}}
{% endfor %}

但是我想限制迭代次数为2

如何使用 Nunjucks 做到这一点？

我知道有一个范围选项，但我找不到在这种情况下如何使用它。

Answer 1

您可以通过几种不同的方式完成此操作：

A) 使用loop.index0特殊变量(Demo in Codepen)

在 for loop 中，您可以使用 loop.index0 代替 limit-var

{% for obj in data %}
    {% if loop.index0 < 2 %}    
        {{obj.src}}: {{obj.name}}
    {% endif %}
{% endfor %}

B) 添加自定义过滤器 (Demo in Codepen)

但更具可读性的是添加 custom filter limit 并使用它

var nunjucks  = require('nunjucks');
var env = nunjucks.configure();

var data = [
    {src: "src1", name: "name 1"}, 
    {src: "src2", name: "name 2"}, 
    {src: "src3", name: "name 3"}
];

env.addFilter('limit', function(arr, limit) {
    return arr.slice(0, limit);
});

var res = nunjucks.renderString(`
    {% for obj in data | limit(2) %}
    {{obj.src}}: {{obj.name}}
    {% endfor %}`, 
    {data}
);

console.log(res);

C) 使用原生 slice() function (Demo in Codepen)

{% for obj in data.slice(0, 2) %}
    {{obj.src}}: {{obj.name}}
{% endfor %}