Nunjucks：同时循环遍历两个数组答案

【问题标题】：Nunjucks: Loop through two arrays simultaneouslyNunjucks：同时循环遍历两个数组
【发布时间】：2020-05-25 04:46:04
【问题描述】：

我试图在 nunjucks 中同时遍历两个数组：

数组 1：

property.car_ids: ["23", "35", "45"]

数组 2：

property.cars: ["Toyota", "BMW", "Volvo"]

Nunjucks 代码：

<select name="carSelect">
  <option value="" >Select car...  </option>
    {% for n in range(0, property.car_ids) -%}  
      <option value="{{ property.car_ids[n] }}" >{{ property.cars[n] }}</option>
    {% endfor %}   
</select>

for 循环的预期输出是

<option value="23" >Toyota</option>
<option value="35" >BMW</option>
<option value="45" >Volvo</option>

但它根本不创建任何选项字段。为什么它不起作用？

编辑：在对以下 nunjucks html 进行进一步实验后，我更加困惑：

Ids: {{ property.car_ids }} //prints out 23, 35, 45
Cars: {{ property.cars }} //prints out Toyota, BMW, Volvo
Id: {{ property.car_ids[2] }}  //prints 45
Car: {{ property.cars[2] }} //prints Volvo
Length: {{ property.car_ids | length }} //prints 3 
Loop:           
{% for k in range(0, property.car_ids) %}  
  {{ property.car_ids[k] }}
{% endfor %}  //doesnt work (doesn't print anything)!!!!!

发生了什么事？？

【问题讨论】：

标签： nunjucks

【解决方案1】：

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

const html = env.renderString(`
    {% for id in car_ids %} 
        {{id}} {{cars[loop.index0]}} 
    {% endfor %}`, 
    { 
        car_ids: [23, 35, 45],
        cars: ['Toyota', 'BMW', 'Volvo']
    }
);

console.log(html);

附：我在您的代码中发现了一个错误：range(0, property.car_ids.length) :)

【讨论】：