web-dev-qa-db-fra.com

Boucle dans le moteur de template Jade (actuellement appelé "Pug")

Je veux utiliser une boucle simple comme for(int i=0; i<10; i++){}.

Comment l'utiliser dans le moteur Jade? Je travaille avec Node.js et utilise le framework expressjs.

52
Huy Tran

par exemple: 

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

vous pouvez voir https://github.com/visionmedia/jade pour un document détaillé.

87
qiao

En utilisant node, j'ai une collection de choses @stuff et j'y accède comme ceci:

- each stuff in stuffs
  p
    = stuff.sentence
70
thenengah

Une façon inhabituelle mais jolie de le faire

Sans index :

each _ in Array(5)
  = 'a'

Imprimera: aaaaa

Avec index :

each _, i in Array(5)
  = i

Imprimera: 01234

Notes : Dans les exemples ci-dessus, j'ai affecté le paramètre val de la syntaxe d'itération each de jade à _ car il est obligatoire, mais renverra toujours undefined.

25
Christophe Marois

Voici un fichier jade très simple qui contient une boucle. Jade est très sensible aux espaces blancs. Après la ligne de définition de la boucle (for), vous devez donner un retrait (tabulation) aux éléments souhaitant être insérés dans la boucle. Vous pouvez le faire sans {}:

- 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]
16
Mohsen

Ajoutez simplement une autre possibilité, car cela pourrait aider quelqu'un qui essaie à la fois de parcourir un tableau ET de conserver un compte. Par exemple, le code ci-dessous passe par un tableau nommé items et n’affiche que les 3 premiers éléments. Notez que la each et la if sont en jade natif et n’ont pas besoin de trait d’union.

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

Vous pouvez également accélérer les choses avec une boucle while (voir ici: http://jsperf.com/javascript-while-vs-for-loops ). Aussi beaucoup plus concis et lisible IMHO:

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

Pug (renommé «Jade») est un moteur de gabarit pour le développement d'applications Web à pile complète. Il fournit une syntaxe propre et nette pour l'écriture HTML et maintient une indentation stricte des espaces (comme Python). Il a été implémenté avec des API JavaScript. Le langage supporte principalement deux constructions d'itération: chacune et tout le temps. 'for' peut être utilisé à la place de 'each'. Veuillez consulter la référence de langue ici:

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

Voici un de mes extraits: chaque/pour une itération dans pug_screenshot

0
Amlan Samanta - Rx