Question

我正在用快速平台学习nodejs。我生成了一个快速项目，我编辑了2个路由文件。一个路由文件是“users.js”，它应该在请求'/ users'时呈现layou.hbs，另一个是“index.js”，并且当请求'/'时它应该呈现“home.hbs”。问题是，当在URL框上请求'/'时，我在浏览器上获得layout.hbs输出。我究竟做错了什么？这是文件中的代码。

index.js

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('home', {title:Express});
});
module.exports = router;

user.js的

var express = require('express');
var router = express.Router();

router.get('/users', function(req, res, next) {
    res.render('layout', {title:Express});
  	//res.send('respond with a resource');
});

module.exports = router;

Home.hbs

</!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<p>goodbye World</p>
</body>
</html>

layout.hbs

</!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>

	<p> Hello World!</p>

</body>
</html>

如果我访问localhost：3000，我希望看到“再见世界”，但我看到“你好世界”，这段代码有什么问题？谢谢。

Answer 1

在您正在呈现'home'的两个文件中。在第res.render('home', {title:Express});行

在user.js中执行以下操作：

res.render('layout', {title:Express});

干杯：）

Answer 2

你应该记得要求express-hbs并告诉express使用它。您的主app.js或您提供该文件的任何其他名称应如下所示。

var http = require('http');
var express = require('express');
var hbs = require('express-hbs'); //load handlebars
var app = express();

// setup hbs view engine 
app.set('view engine', 'hbs');

//location of your views folder
app.set('views', __dirname + '/views');


http.createServer(app).listen(3000);

Answer 3

无论您渲染什么模板，它都会作为布局的主体加载。为此，您的布局应如下所示：

</!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>

	{{{body}}}

</body>
</html>

实际的身体内容应该放在您渲染的模板中

home.hbs

  <p> Hello World!</p>

goodbye.hbs

  <p> Goodbye World!</p>

这样做

 res.render('home');

在渲染时会显示“ hello world”

 res.render('goodbye');

将显示“再见的世界”

如果您想使用其他布局来包装给定的模板，则可以覆盖默认设置：

  res.render('other', {layout: 'other_layout'});

顺便说一句，将变量“ title”传递为

 {title: Express}

什么也没有。未声明“ Express”变量。您应该改用定义的变量或传递字符串文字

 {title: 'Express'}

并且，要使其在生成的HTML中显示，布局将按以下方式使用它：

</!DOCTYPE html>
<html>
<head>
	<title>{{title}}</title>
</head>
<body>

	{{{body}}}

</body>
</html>

请注意，主体部分有3个花括号，而模板变量仅使用2个。

如何从路由模块

3 个答案: