时间戳

首页 > 解决方案 > 表单提交时 EJS 变量引用错误

node.js - 表单提交时 EJS 变量引用错误

问题描述

我的“welcome.ejs”页面上有一个表格。现在，我只是尝试将用户在“welcome.ejs”上输入的文本输出到新页面“submitform.ejs”。如果我不尝试从表单输出文本，则页面成功路由。

我收到以下错误：

ReferenceError: C:\Users\hbhar\Desktop\Basic WebApp\views\submitform.ejs:2
    1| <h1>Form Submitted!</h1>

 >> 2| <<p><%= parsedbody %></p>

    3| 

parsedbody is not defined
    at eval (eval at compile (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\ejs\lib\ejs.js:649:12), <anonymous>:12:26)
    at submitform (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\ejs\lib\ejs.js:679:17)
    at tryHandleCache (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\ejs\lib\ejs.js:272:36)
    at View.exports.renderFile [as engine] (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\ejs\lib\ejs.js:478:10)
    at View.render (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\express\lib\view.js:135:8)
    at tryRender (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\express\lib\application.js:640:10)
    at Function.render (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\express\lib\application.js:592:3)
    at ServerResponse.render (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\express\lib\response.js:1012:7)
    at ServerResponse.res.render (C:\Users\hbhar\Desktop\Basic WebApp\node_modules\express-ejs-layouts\lib\express-layouts.js:77:18)
    at C:\Users\hbhar\Desktop\Basic WebApp\routes\index.js:15:9

我的 index.js 文件（在 /routes 中找到）：

const express = require('express');
const router = express.Router();

// Welcome Page
router.get('/', (req, res) => res.render('welcome'));
router.get('/submitform', (req,res) => res.render('submitform'))
// After Form Submission
router.post('/submitform', function(req, res) 
  {
    const parsedbody = {};
    const formsubmission = JSON.stringify(req.body);
    parsedbody[formsubmission] = formsubmission;
    res.render('submitform', parsedbody);
  });

module.exports = router;

我的主要“welcome.ejs”页面：

<form action="/submitform" method="POST">
      <label for="name">Name</label>
      <input
        type="name"
        id="name"
        name="name"
        class="form-control"
        placeholder="Name"      
        </input>
  <button type="submit"></button>
</form>

我的“submitform.ejs”文件被路由到上面（我也尝试了响应对象的变体）：

<h1>Form Submitted!</h1>
<<p><%= parsedbody %></p>

谢谢！

标签： node.jsformsexpresstemplatesejs

解决方案

模板中的顶级变量将具有您传递给渲染的对象的属性名称。

所以如果你有：

const data = { hello: "World" }
res.render('submitform', data);

然后你可以使用<%= hello %>

引用该对象的变量的名称未传递给模板。JavaScript 函数参数从不传递变量的名称。你不能使用<%= data %>

formsubmission变量的值不是属性的有用名称。

推荐阅读