blocks|key|229998|text|我认为只有在迭代数组时才会得到索引，所以jade文档与它的示例有点混淆。关于如何实现这一点，我将为您提供三种选择。选择你自己的冒险吧！|type|unstyled|depth|inlineStyleRanges|entityRanges|data|229999|选项1:保留原始输入并构建自己的索引|230000|ul
++-var+index+=+0
++each+val,+key+in+{day:+"Wed",+link:+"url",+message:+"three"}
++++li(id="item-#{index%2B%2B}")+#{key}:+#{val}|code-block|syntax|javascript|230001|选项2:将输入更改为数组的数组|230002|ul
++each+val,+index+in+[["day",+"Wed"],+["link",+"url"],+["message",+"three"]]
++++li(id="item-#{index}")+#{val[0]}:+#{val[1]}|230003|选项3:将输入更改为对象数组|230004|ul
++each+val,+index+in+[{day:+"Wed"},+{link:+"url"},+{message:+"three"}]
++++li(id="item-#{index}")+#{Object.keys(val)[0]}:+#{val[Object.keys(val)[0]]}|230005|第一个选项可能是您想要的，但其他选项读起来可能很有趣。|230006|entityMap^0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|V|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|W|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|X|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|Z|8|@]|9|@]|A|$]]|$1|O|3|P|5|F|7|10|8|@]|9|@]|A|$G|H]]|$1|Q|3|R|5|6|7|11|8|@]|9|@]|A|$]]|$1|S|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|T|$]]

<p>I think you only get an index if you are iterating over an array, so the jade documentation is a little confusing with its example. I'll give you three options for how to accomplish this. Choose your own adventure!</p>

<h3>option 1: Keep your original input and build your own index</h3>

<pre><code>ul
  -var index = 0
  each val, key in {day: "Wed", link: "url", message: "three"}
    li(id="item-#{index++}") #{key}: #{val}
</code></pre>

<h3>option 2: Change your input to an array of arrays</h3>

<pre><code>ul
  each val, index in [["day", "Wed"], ["link", "url"], ["message", "three"]]
    li(id="item-#{index}") #{val[0]}: #{val[1]}
</code></pre>

<h3>option 3: Change your input to an array of objects</h3>

<pre><code>ul
  each val, index in [{day: "Wed"}, {link: "url"}, {message: "three"}]
    li(id="item-#{index}") #{Object.keys(val)[0]}: #{val[Object.keys(val)[0]]}
</code></pre>

<p>The first option is probably what you want, but the others may be interesting to read.</p>


blocks|key|230049|text|除了这个已经回答过的问题之外，我还不能让其中的任何一个与PyJade一起可靠地工作。我找不到向我推荐这篇技巧的页面，但它对我来说工作得很好。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|230050|将此代码添加到您的__init__.py文件中，将enumerate函数添加到您的pyjade环境中。|offset|length|style|CODE|230051|app.jinja_env.globals.update(enumerate=enumerate)|code-block|syntax|javascript|230052|然后，您可以像使用其他pythonic枚举循环一样在模板中使用它：|230053|for+idx,+val+in+enumerate(list_of_whatevs)
++++{{+idx+}},+{{+val+}}|230054|干杯|230055|entityMap^0|0|9|B|P|9|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|V|8|@$D|W|E|X|F|G]|$D|Y|E|Z|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|10|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|11|8|@]|9|@]|A|$]]|$1|O|3|P|5|J|7|12|8|@]|9|@]|A|$K|L]]|$1|Q|3|R|5|6|7|13|8|@]|9|@]|A|$]]|$1|S|3|-4|5|6|7|14|8|@]|9|@]|A|$]]]|T|$]]

<p>Just to add to this already answered question, I wasn't able to get any of these to work reliably with PyJade. I can't find the page that referred me to this tip, but it's worked perfectly for me.</p>

<p>Add this to your <code>__init__.py</code> file to added the <code>enumerate</code> function to your pyjade environment.</p>

<pre><code>app.jinja_env.globals.update(enumerate=enumerate)
</code></pre>

<p>Then, you can use it in your templates like any other pythonic enumeration loop:</p>

<pre><code>for idx, val in enumerate(list_of_whatevs)
    {{ idx }}, {{ val }}
</code></pre>

<p>Cheers</p>


blocks|key|13736|text|使用Object.entries()+(和Pug+2.0.4)的另一种选择：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|13737|ul
++each+entry,+index+in+Object.entries({day:+'Wed',+link:+'url',+message:+'three'})
++++-+const+[key,+val]+=+entry
++++li(id=`item-${index}`)+#{key}:+#{val}|code-block|syntax|javascript|13738|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries^0|2|G|2|G|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@$9|T|A|U|B|C]]|D|@$9|V|A|W|1|X]]|E|$]]|$1|F|3|G|5|H|7|Y|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Z|8|@]|D|@]|E|$]]]|L|$M|$5|N|O|P|E|$Q|R]]]]

<p>One more option using <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries" rel="nofollow noreferrer"><code>Object.entries()</code></a> (and Pug 2.0.4):</p>
<pre><code>ul
  each entry, index in Object.entries({day: 'Wed', link: 'url', message: 'three'})
    - const [key, val] = entry
    li(id=`item-${index}`) #{key}: #{val}
</code></pre>


<p>As described here: <a href="http://jade-lang.com/reference/">http://jade-lang.com/reference/</a>, it is easy enough to either get the index or the key. But is there a way to get both?<br><br>
This: </p>

<pre><code>ul
  each val, index in {"day": "Wed", "link": "url", "message": "three"}
    li#item-= index + ': ' + val
</code></pre>

<p>Outputs this:</p>

<pre><code>&lt;ul&gt;
  &lt;li id="item-"&gt;day: Wed&lt;/li&gt;
  &lt;li id="item-"&gt;link: url&lt;/li&gt;
  &lt;li id="item-"&gt;message: three&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>But I want this:</p>

<pre><code>&lt;ul&gt;
  &lt;li id="item-0"&gt;day: Wed&lt;/li&gt;
  &lt;li id="item-1"&gt;link: url&lt;/li&gt;
  &lt;li id="item-2"&gt;message: three&lt;/li&gt;
&lt;/ul&gt;
</code></pre>


Get both the key and the index using Jade iteration

正如这里所描述的：，获取索引或键非常容易。但有没有办法同时做到这两点呢？这一点：ul  each val, index in {"day": "Wed", "link": "url", "message": "three"}    li#item-= index + ': ' + val输出如下：<ul>  <li i...

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

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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