首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >使用Jade迭代获取键和索引

使用Jade迭代获取键和索引
EN

Stack Overflow用户
提问于 2013-09-27 21:51:34
回答 3查看 21.6K关注 0票数 21

正如这里所描述的:http://jade-lang.com/reference/,获取索引或键非常容易。但有没有办法同时做到这两点呢?

这一点:

代码语言:javascript
复制
ul
  each val, index in {"day": "Wed", "link": "url", "message": "three"}
    li#item-= index + ': ' + val

输出如下:

代码语言:javascript
复制
<ul>
  <li id="item-">day: Wed</li>
  <li id="item-">link: url</li>
  <li id="item-">message: three</li>
</ul>

但我想要的是:

代码语言:javascript
复制
<ul>
  <li id="item-0">day: Wed</li>
  <li id="item-1">link: url</li>
  <li id="item-2">message: three</li>
</ul>
EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2013-09-29 03:51:31

我认为只有在迭代数组时才会得到索引,所以jade文档与它的示例有点混淆。关于如何实现这一点,我将为您提供三种选择。选择你自己的冒险吧!

选项1:保留原始输入并构建自己的索引

代码语言:javascript
复制
ul
  -var index = 0
  each val, key in {day: "Wed", link: "url", message: "three"}
    li(id="item-#{index++}") #{key}: #{val}

选项2:将输入更改为数组的数组

代码语言:javascript
复制
ul
  each val, index in [["day", "Wed"], ["link", "url"], ["message", "three"]]
    li(id="item-#{index}") #{val[0]}: #{val[1]}

选项3:将输入更改为对象数组

代码语言:javascript
复制
ul
  each val, index in [{day: "Wed"}, {link: "url"}, {message: "three"}]
    li(id="item-#{index}") #{Object.keys(val)[0]}: #{val[Object.keys(val)[0]]}

第一个选项可能是您想要的,但其他选项读起来可能很有趣。

票数 38
EN

Stack Overflow用户

发布于 2015-04-27 06:32:30

除了这个已经回答过的问题之外,我还不能让其中的任何一个与PyJade一起可靠地工作。我找不到向我推荐这篇技巧的页面,但它对我来说工作得很好。

将此代码添加到您的__init__.py文件中,将enumerate函数添加到您的pyjade环境中。

代码语言:javascript
复制
app.jinja_env.globals.update(enumerate=enumerate)

然后,您可以像使用其他pythonic枚举循环一样在模板中使用它:

代码语言:javascript
复制
for idx, val in enumerate(list_of_whatevs)
    {{ idx }}, {{ val }}

干杯

票数 1
EN

Stack Overflow用户

发布于 2021-01-22 04:30:26

使用Object.entries() (和Pug 2.0.4)的另一种选择:

代码语言:javascript
复制
ul
  each entry, index in Object.entries({day: 'Wed', link: 'url', message: 'three'})
    - const [key, val] = entry
    li(id=`item-${index}`) #{key}: #{val}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/19052539

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档