Javascript 在 Jade(目前称为“Pug”)模板引擎中循环

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8728637/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 07:13:35  来源:igfitidea点击:

Loop in Jade (currently known as "Pug") template engine

javascriptfor-looppugexpress

提问by Huy Tran

I want to use a simple loop like for(int i=0; i<10; i++){}.

我想使用一个简单的循环,如for(int i=0; i<10; i++){}.

How do I use it in the Jade engine? I'm working with Node.js and use the expressjs framework.

我如何在 Jade 引擎中使用它?我正在使用 Node.js 并使用 expressjs 框架。

回答by qiao

for example:

例如:

- for (var i = 0; i < 10; ++i) {
  li= array[i]
- }

you may see https://github.com/visionmedia/jadefor detailed document.

您可以查看https://github.com/visionmedia/jade获取详细文档。

回答by thenengah

Using node I have a collection of stuff @stuffand access it like this:

使用 node 我有一个东西的集合@stuff并像这样访问它:

- each stuff in stuffs
  p
    = stuff.sentence

回答by Christophe Marois

An unusual but pretty way of doing it

一种不寻常但很漂亮的方式

Without index:

没有索引

each _ in Array(5)
  = 'a'

Will print: aaaaa

将打印: aaaaa

With index:

与索引

each _, i in Array(5)
  = i

Will print: 01234

将打印: 01234

Notes: In the examples above, I have assigned the valparameter of jade's eachiteration syntax to _because it is required, but will always return undefined.

注意:在上面的例子中,我已经将valjade 的each迭代语法的参数分配给了,_因为它是必需的,但总是会返回undefined.

回答by Mohsen

Here is a very simple jadefile that have a loop in it. Jade is very sensitive about white space. After loop definition line (for) you should give an indent(tab) to stuff that want to go inside the loop. You can do this without {}:

这是一个非常简单的jade文件,其中有一个循环。Jade 对空白非常敏感。在循环定义行 ( for) 之后,您应该为想要进入循环的内容提供一个缩进(制表符)。你可以不这样做{}

- var arr=['one', 'two', 'three'];
- var s = 'string';
doctype html
html
    head
    body
        section= s
        - for (var i=0; i<3; i++)
            div= arr[i]

回答by k00k

Just adding another possibility as it might help someone that's trying to both iterate over an array AND maintain a count. For example, the code below goes through an array named itemsand only displays the first 3 items. Notice that the eachand the ifare native jade and don't need a hyphen.

只是添加另一种可能性,因为它可能会帮助那些试图迭代数组并维护计数的人。例如,下面的代码遍历一个名为的数组,items并且只显示前 3 项。请注意,eachif是原生玉,不需要连字符。

ul
  - var count = 0;
  each item in items
    if count < 3
      li= item.name
    - count++;

回答by SqrBrkt

You could also speed things up with a whileloop (see here: http://jsperf.com/javascript-while-vs-for-loops). Also much more terse and legible IMHO:

您还可以使用while循环加快速度(请参阅此处:http: //jsperf.com/javascript-while-vs-for-loops)。还有更简洁易读的恕我直言:

i = 10
while(i--)
    //- iterate here
    div= i

回答by Amlan Samanta - Rx

Pug (renamed from 'Jade') is a templating engine for full stack web app development. It provides a neat and clean syntax for writing HTML and maintains strict whitespace indentation (like Python). It has been implemented with JavaScript APIs. The language mainly supports two iteration constructs: each and while. 'for' can be used instead 'each'. Kindly consult the language reference here:

Pug(从“Jade”重命名)是一个用于全栈 Web 应用程序开发的模板引擎。它为编写 HTML 提供了简洁干净的语法,并保持严格的空格缩进(如 Python)。它已通过 JavaScript API 实现。该语言主要支持两种迭代结构:each 和 while。“for”可以用来代替“each”。请在此处查阅语言参考:

https://pugjs.org/language/iteration.html

https://pugjs.org/language/iteration.html

Here is one of my snippets: each/for iteration in pug_screenshot

这是我的片段之一: 每个/用于 pug_screenshot 中的迭代