admin管理员组

文章数量:1431391

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.

  • javascript
  • node.js
  • express
  • ejs
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 0
Add a ment  | 

4 Answers 4

Reset to default 2

You 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);

本文标签： javascriptNavigation using express and EJSStack Overflow

版权声明：本文标题：javascript - Navigation using express and EJS - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745572540a2664133.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。