Having a issue figuring out how to navigate between EJS pages effectively:
File directory:
I want to go from my index.ejs page to the about.ejs page. This is the code for my index.ejs page which is currently not navigating properly:
index.ejs:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1> <a href="about.ejs"> This is a link to about page</a></h1>
</body>
</html>
app.js server:
const express = require("express");
const path = require('path');
const app = express();
app.set("views", path.resolve(__dirname, "views"));
app.set("view engine", "ejs")
app.get("/", (req, res) => {
res.render("index")
});
app.use(express.static('public'));
app.listen(3000);
What could I enter in the href to properly reference the dynamic about.ejs file? I already know that I can reference static files from my public folder but I want to refernce the dynamic ejs folder. If not possible any solution which provides the same functionality will also do.
Having a issue figuring out how to navigate between EJS pages effectively:
File directory:
I want to go from my index.ejs page to the about.ejs page. This is the code for my index.ejs page which is currently not navigating properly:
index.ejs:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1> <a href="about.ejs"> This is a link to about page</a></h1>
</body>
</html>
app.js server:
const express = require("express");
const path = require('path');
const app = express();
app.set("views", path.resolve(__dirname, "views"));
app.set("view engine", "ejs")
app.get("/", (req, res) => {
res.render("index")
});
app.use(express.static('public'));
app.listen(3000);
What could I enter in the href to properly reference the dynamic about.ejs file? I already know that I can reference static files from my public folder but I want to refernce the dynamic ejs folder. If not possible any solution which provides the same functionality will also do.
Share Improve this question asked Oct 2, 2017 at 18:48 Willem van der VeenWillem van der Veen 36.8k18 gold badges206 silver badges176 bronze badges 04 Answers
Reset to default 2You should render about.ejs template to use it on the client. To do that, you need to create a new route:
app.get("/about", (req, res) => {
res.render("about");
});
To open it use /about
path.
Your link should point to /about
.
Then you have to options. 1) have a function in your server to serve that page. 2) serve your pages dynamically.
1.
app.get("/about", (req, res) => {
res.render("about")
});
2.
app.get("/:page", (req, res) => {
res.render(req.params.page);
});
You need to create a route for your about page
app.get("/about", (req, res) => {
res.render("about")
});
And remove the extension from the hyperlink. The hyperlink should be :
<a href="/about">About</a>
Notice the correction in your index.ejs at line 7
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1><a href='/about'> About</a></h1> //there's no point including the ".ejs" extension at the end of the "about"
</body>
</html>
In your app.js server, also notice the addition of the (about route).
const express = require("express");
const path = require('path');
const app = express();
app.set("views", path.resolve(__dirname, "views"));
app.set("view engine", "ejs")
app.get("/", (req, res) => {
res.render("index")
});
app.get('/about', (req, res)=>{ //here you can include a new "about" route that should take you to the "about" page
res.render('about')
});
app.use(express.static('public'));
app.listen(3000);
发布者:admin,转转请注明出处:http://www.yc00.com/questions/1745572541a4633767.html
评论列表(0条)