Jade迭代到HTML表

问题描述 投票:1回答:2

如何将价格数组添加到Jade中的第二个'td'标签?我希望它是迭代。可能吗?

- var item = ['Item1', 'Item2', 'Item3']
- var price = ['40', '90', '140']

table.pricetable
    thead
        tr
            th item
            th price
    tbody
        each a in item
            tr
                td #{a}
                td ???

谢谢,西蒙

html5 iteration pug
2个回答
1
投票

假设它们直接相关:

- var item = ['Item1', 'Item2', 'Item3']
- var price = ['40', '90', '140']

table.pricetable
    thead
        tr
            th item
            th price
    tbody
        each a, index in item
            tr
                td #{a}
                td #{price[index]}

但是,更好的方法是使用一个对象数组,而不是两个单独的数组:

- var items = [{item: 'Item1', price: 40}, {item: 'Item2', price: 90}, {item: 'Item3', price: 140}]

table.pricetable
    thead
        tr
            th item
            th price
    tbody
        each a in item
            tr
                td #{a.item}
                td #{a.price}

1
投票

是的,通过在循环中获取索引,这是可能的:

- var item = ['Item1', 'Item2', 'Item3']
- var price = ['40', '90', '140']

table.pricetable
    thead
        tr
            th item
            th price
    tbody
        each a, index in item
            tr
                td #{a}
                td #{price[index]}

这允许您获取正在迭代的当前值的索引,并且可以用于访问另一个数组中的相同位置。

© www.soinside.com 2019 - 2024. All rights reserved.