Javascript 尽管正确链接HTML，但仍存在未定义的错误

我已将路由链接到html，但html始终显示未定义的agentData。为什么它会给我这个错误 尽管链接正确。在app.js代码中，我链接了登录和管理的路径。Routes是登录的位置 根据用户名和密码控制用户的去向。我在他们登录routes.js后呈现html页面，然后在 admin.js是它从mysql数据库获取所有数据并输出为表的地方。如您所见，我确实声明了agentData 在admin.js中。但是，如果我删除routes.js中的app.get/admin，它们会给我另一个错误cannot/get admin error。什么 我该怎么办

routes.js

const express = require('express');
const router = express.Router();
const db = require('../server');

router.get("/",  async function (request, response) {
    response.render("login.ejs");
  });

  router.get("/register", async function (req, res) {
    res.render("register.ejs");
  });

  router.post("/login", async function (request, response) {
    const { username, password } = request.body;

    if (username == 2 && password == 2) {
      response.redirect("/admin");
    } 

    else {
      return response.status(401).json({
        message: "Auth fail",
      });
    }
  });

  router.get('/admin', function(req, res, next) {
    console.log('reach page');
    const sql='SELECT * FROM agentavia';
    db.query(sql, function (err, data, fields) {
      console.log(data);
    if (err) throw err;
    res.render('adminhome', { title: 'Agent List', agentData: data});
  });
  });
  
  router.get('/edit/:id', function(req, res, next) {
    const AgentId= req.params.id;
    const sql=`SELECT * FROM agentavia WHERE id=${AgentId}`;
    db.query(sql, function (err, data) {
      if (err) throw err;
      res.render('modifyAgent', { title: 'Agent List', editData: data[0]});
    });
  });
  
  router.post('/edit/:id', function(req, res, next) {
    const id= req.params.id;
      const updateData=req.body;
      const sql = `UPDATE agentavia SET ? WHERE id= ?`;
      db.query(sql, [updateData, id], function (err, data) {
      if (err) throw err;
      console.log(data.affectedRows + " record(s) updated");
    });
    res.redirect('/admin');
  });
  
  module.exports = router;

adminhome.ejs

    <table border="1">
        <tr>
            <th>S.N</th>
            <th>Agent Name</th>
            <th>Agent ID</th>
            <th>AgentStatus</th>
            <th>Edit</th>
        </tr>

        <% if(agentData.length!=0){ var i=1; agentData.forEach(function(data){ %>
        <tr>
            <td><%=i; %></td>
            <td><%=data.agentName %></td>
            <td><%=data.agentID %></td>
            <td><%=data.agentStatus %></td>
            <td><a href="/admin/edit/<%=data.id%>">Edit</a></td>
        </tr>
        <% i++; }) %> <% } else{ %>
        <tr>
            <td colspan="7">No Data Found</td>
        </tr>
        <% } %>
    </table>

S.N
代理名称
代理ID
代理状态
编辑
没有找到任何数据

modifyagent.ejs

<div class="agent-detail">
   
    <form action="<%=(typeof editData!='undefined')?'/admin/edit/'+editData.id:'/admin/create'%>" method="POST">
          <label>Agent Name</label>
          <input type="agentname" placeholder="Enter Agent Name" name="agentName" required value="<%=(typeof editData!='undefined')? editData.agentName:''%>">
          <label>Agent ID</label>
          <input type="agentID" placeholder="Enter Agent ID" name="agentID" required value="<%=(typeof editData!='undefined')? editData.agentID:''%>">
          <label>Agent Status</label>
          <input type="Agent Status" placeholder="Enter Agent Status" name="agentStatus" required value="<%=(typeof editData!='undefined')? editData.agentStatus:''%>">
          <button type="submit">Submit</button>
        </div>
  </div>

代理名称
代理ID
代理状态
提交

1.文件扩展名中的问题。它应该是adminhome.ejs，而不是 adminhome.html

或者另一种方法是使用includes

有关如何与includes一起使用，请参阅此

这个例子我已经在本地测试过了，效果很好

app.js

    const express = require('express');
    const app = express();

    // set the view engine to ejs
    app.set('view engine', 'ejs');

    // index page 
    app.get('/', function (req, res) {
        var data = [
            { id: 1,agentName: 'Bloody Mary', agentID: 3,agentStatus: 'yes' },
            { id:2,agentName: 'Martini', agentID: 5 ,agentStatus: 'no'},
            { id:3,agentName: 'Scotch', agentID: 10 ,agentStatus: 'yes'}
        ];


        res.render('index', {
            agentData: data
        });
    });

    app.listen(3000, () => console.log('listening at 3000'));

Index.ejs

    <h2>Loop</h2>

    <table border="1">
        <tr>
          <th>S.N</th>
          <th>Agent Name</th>
          <th>Agent ID</th>
          <th>AgentStatus</th>
          <th>Edit</th>
        </tr>
      
        <% if(agentData.length!=0){ var i=1; agentData.forEach(function(data){ %>
        <tr>
          <td><%=i; %></td>
          <td><%=data.agentName %></td>
          <td><%=data.agentID %></td>
          <td><%=data.agentStatus %></td>
          <td><a href="/agents/edit/<%=data.id%>">Edit</a></td>
        </tr>
        <% i++; }) %> <% } else{ %>
        <tr>
          <td colspan="7">No Data Found</td>
        </tr>
        <% } %>
      </table>

循环
S.N
代理名称
代理ID
代理状态
编辑
没有找到任何数据

---

Ejs参考：

您能检查一下这些记录是否在表格SELECT*FROM agentavia中吗？您不应该在另一个

app.get中有
app.get（…
）（…

在您的

routes.js

文件中。它不是这样工作的，这意味着如果您重新启动服务器，已经登录的人将无法访问

/admin

。另外，既然您在

admin.js

中正确定义了它，为什么要在那里呢？您不能在多个地方定义它。正如@VijayPalaskar，尝试

console.log（数据）

在

res.render（'adminhome'）的正上方，{title…

为了查看数据是否在那里是的，我确实在里面有记录。我甚至设法让它在另一个文件夹中工作，所以我将它一点一点地转移到我制作的原始项目文件夹中，我在这里展示。至于app.get部分，当我看到其他示例时，实际上有一个现有的示例，它工作得非常好e、 所以，使用路由器而不是app.get是更好的做法吗？是的，路由器而不是app.get。我认为您的文件扩展名中存在问题。您能检查它是否与..ejs扩展名一起工作吗？在呈现页面之前，我已尝试放置console.log。它没有提供任何数据…感谢您的帮助，但我仍然收到相同的错误agentData尽管将所有app.get更改为router.get，但未定义。我还将adminhome.html更改为adminhome.ejs。是否应使用最新代码更新问题？请参阅我已更新了我在本地服务器上测试的答案。它工作正常。如果身份验证失败并传递错误消息，则可以重定向到登录&如果成功，则重新登录t到仪表板页面。我建议您不要使用ejs。使用任何前端技术react、angular、vue JS无法获取/admin/edit/1此消息显示或其他消息显示？此消息显示，因为您尚未定义任何路由。它将与/edit/1到/admin/edit/1协同工作，您必须像此或应用程序一样定义路由。使用（'/admin'，路由文件的加载路径）…此路由js文件的所有url都从/admin path开始。另一种方法是到router.get（'admin/edit/：id'，（）=>{}），但这不是更好的方法。它将起作用。有关详细信息，请参阅此方法：