Dynamisch erstellen Elemente innerhalb Mops (Jade)

Question

Ich versuche, Elemente in Mug-Vorlage dynamisch zu erstellen.

ich abrufen eine Informationen aus der Datenbank

db.component.findAll().then(function(component){ 
    res.render('stock' ,{ table:component}) 
    }) 

die Vorlage Grund Befehl, dass der Inhalt erstellt werden soll ist

.tbl-content 
    table(cellpadding='0', cellspacing='0', border='0') 
     tbody 
     - row in table 
      tr 
       td= "#{row.name}" 
       td= "#{row.storage}" 

ich die Syntax überprüft und es sollte korrekt sein, aber Das Ergebnis ist komplett falsch. Es dauert row in table als Zeichenfolge z. B. Inhalt und zeigen Sie es auf der Seite, die gleiche mit "#{row.name}" und "#{row.storage}"

Ich verwende eine veraltete Syntax oder ist meine Vorgehensweise völlig falsch?

Danke!

Answer 1

Ihre verwendete Syntax scheint falsch zu sein, wenn Sie die Standard-pug Template-Engine für Node.js verwenden

Sie können es durch funktioniert:

.tbl-content 
    table(cellpadding='0', cellspacing='0', border='0') 
     tbody 
     each row in table 
      tr 
       td= row.name 
       td= row.storage 

explaned genauer in der Dokumentation : https://pugjs.org/language/iteration.html

Meine komplette einfache Node.js Testdatei mit dem ich die erfolgreiche Prüfung tat, war:

var express = require('express'); 
var app = express(); 
app.set('view engine', 'pug'); 

var component = [ 
    {name:'myName', storage:'myStorage'}, 
    {name:'myName2', storage:'myStorage2'} 
]; 
app.get('/table', function (req, res) { 
    res.render('stock' ,{ table:component}); 
}); 

app.listen(3000); 

Es ist in der Antwort ergibt:

<div class="tbl-content"> 
<table cellpadding="0" cellspacing="0" border="0"> 
    <tbody> 
    <tr><td>myName</td><td>myStorage</td></tr> 
    <tr><td>myName2</td><td>myStorage2</td></tr> 
    </tbody> 
</table> 
</div>