2016-09-15 48 views
2

pugテンプレート内の要素を動的に作成しようとしています。 pug(jade)内の要素を動的に作成

が、私は基本的なコマンドを使用してデータベースから情報を取得

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

、コンテンツが作成されることになっているテンプレートは、私は、構文をチェックして

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

であり、それが正しいはずですが、結果は完全に間違っています。文字列としてコンテンツとしてrow in tableが表示され、ページ上に表示されます。"#{row.name}"および"#{row.storage}"

古い構文を使用していますか、私のアプローチは完全に間違っていますか?

ありがとうございます!

文書でより詳細にExplaned
.tbl-content 
    table(cellpadding='0', cellspacing='0', border='0') 
     tbody 
     each row in table 
      tr 
       td= row.name 
       td= row.storage 

答えて

2

ご使用される構文を使用すると、Node.jsの

のデフォルトpugテンプレートエンジンを使用している場合は、それがで動作させることができます間違っているようです: https://pugjs.org/language/iteration.html

私は成功し、テストをしていたこれで私の完全なシンプルなNode.jsのテストファイル:

これは、応答をもたらす
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); 

<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> 
関連する問題