Wie übergeben Sie den Variablenwert in einer Klasse eines Anchor-Tags in der PUG-Vorlagen-Engine?

Question

Ich versuche <a> Tag 5 Mal mit PUG Vorlage Motor zu drucken.

Ich möchte meinen Code wie folgt. Wo ich will nur zwei classe Artikel und Artikel-1,2,3 usw.

HTML-Code: gewünschte Ergebnis

<a class="item item-1" href="#">1 Item</a><br/> 
<a class="item item-2" href="#">2 Item</a><br/> 
<a class="item item-3" href="#">3 Item</a><br/> 
<a class="item item-4" href="#">4 Item</a><br/> 

ich diesen Code jetzt bin mit der ist unten und funktioniert gut

PUG-Code

- for (var x=1; x < 6; x++) 
    a.item.item-(href='#') #{x} Item 
    br 

, die in HTML-Ausgabe ist unten und #{x} Variable Druck feiner

<a class="item item-" href="#">1 Item</a><br/> 
<a class="item item-" href="#">2 Item</a><br/> 
<a class="item item-" href="#">3 Item</a><br/> 
<a class="item item-" href="#">4 Item</a><br/> 
<a class="item item-" href="#">5 Item</a><br/> 

Aber wenn ich bin mit #{x} Variable wie unten, damit er Fehler zeigt,

- for (var x=1; x < 6; x++) 
    a.item.item-#{x}(href='#') #{x} Item 
    br 

Fehler

Pug:2:17 
    1| - for (var x=1; x < 6; x++) 
    > 2|  a.item.item-#{x}(href='#') #{x} Item 
-----------------------^ 
    3|  br 

Unexpected token `interpolation` expected `text`, `interpolated-code`, `code`, `:`, `slash`, `newline` or `eos` 

ich weiß, dass wir # für ID verwenden, aber warum ist es nicht Wert Druck von x nach item- in der Klasse?

Answer 1

Ich habe es geschafft, in Pug's documentation wie angegeben durch Änderung des Codes Ihre gewünschte Ergebnis zu erhalten:

- for (var x=1; x < 6; x++) 
    a(class='item item-'+x)(href='#') #{x} Item 
    br 

Codepen: https://codepen.io/anon/pen/YrqBdY

Answer 2

Sie können es wie folgt schreiben:

- for (var x=1; x < 6; x++) 
    a.item(href='#', class="item-#{x}") #{x} Item 
    br