請解釋一下,爲什麼我的代碼不起作用? 我使用快速寬度的把手,使用JQuery Ajax進行表單提交。第一個渲染工作正常,但第二個渲染沒有。我認爲問題在於嵌套'res.render'。希望對您的答案:-)我被困在使用快遞和車把的渲染模板
app.js
var express = require('express');
var app = express();
var template = require('consolidate');
var handlebars = require('handlebars');
var bodyparser = require('body-parser');
app.use(bodyparser.urlencoded({extended: false}));
app.engine('hbs', template.handlebars);
app.set('view engine', 'hbs');
app.set('views', __dirname);
app.get('/', function(req, res) {
res.render('index', {
myName: 'John'
});
});
app.post('/', function(req, res) {
var obj = {surname: req.body.surname, age: req.body.age};
res.render('Layout.hbs', obj, function(err, html) {
if(err) {
console.log(err);
} else {
console.log(html);
res.render('index.hbs', {
content: html
})
}
}
);
});
app.listen(8080, function() {
console.log('App listening on 8080');
});
index.hbs
<div class="wrapper">
<div class="container">
<p>{{myName}}</p>
</div>
<form action="" name="form" id="form" method="post">
<input id="surname" type="text" name="surname" placeholder="surname"><br/>
<input id="age" type="text" name="age" placeholder="age"><br/>
<input type="submit">
</form>
{{{content}}}
</div>
<script type="text/javascript">
$(document).ready(function() {
$('form').on('submit', function(e) {
e.preventDefault();
var form = $(this);
var surname = form.find('#surname').val();
var age = form.find('#age').val();
$.ajax({
type: 'POST',
data: {surname: surname, age: age},
success: function(res) {
console.log('Success');
},
error: function(err) {
console.log(err);
}
});
});
});
</script>
Layout.hbs
<div class="inner-container">
<h1>{{surname}}</h1>
<h2>{{age}}</h2>
<p>Render</p>
</div>
你爲什麼嵌套'res.render()'調用更換呢?內容上的一個渲染應該足夠了。 – jfriend00
我需要在「索引」內渲染「佈局」模板,我如何在沒有嵌套渲染的情況下執行此操作? – Dima
把手有自己的機制來嵌入主模板內的另一個模板。您需要使用該機制,而不是調用'res.render()'兩次。如果您顯示實際的模板並更詳細地解釋您要完成的任務,我們將更有可能提供幫助。 – jfriend00