在EJS中如何处理HTML标签value属性内的未定义变量？

• 方法一：在Node渲染层设置默认值（最推荐）
  在处理表单的路由里，不管是首次GET请求还是提交后的POST请求，都给genre变量传一个默认值，确保模板渲染时变量始终存在：

  // 示例路由代码
  app.get('/form', (req, res) => {
    // 首次渲染时genre为空字符串，提交后如果有值则用req.body里的内容
    res.render('form', { genre: req.body.genre || '' });
  });
  
  app.post('/form', (req, res) => {
    // 验证数据，若不完整则重新渲染表单并带回已填内容
    if (!req.body.genre || !req.body.otherField) {
      res.render('form', { genre: req.body.genre || '' });
    } else {
      // 处理合法数据
    }
  });
  

  之后模板里直接写value="<%= genre %>"就不会报错了。

• 方法二：在EJS模板里用短路求值或三元运算符
  不需要改后端，直接在模板的value属性里做判断，EJS支持在<%= %>里写表达式：

  <!-- 用三元运算符判断变量是否存在 -->
  <input type="text" name="genre" value="<%= typeof genre !== 'undefined' ? genre : '' %>">
  
  <!-- 更简洁的短路写法（如果genre不会是0、false这类假值的话可用） -->
  <input type="text" name="genre" value="<%= genre || '' %>">
  

• 方法三：在模板开头提前定义变量
  在EJS模板的最上方先检查并初始化genre，之后整个模板里都能安全使用：

  <% 
    // 若genre未定义则设为空字符串
    genre = typeof genre !== 'undefined' ? genre : '';
  %>
  
  <!-- 后面直接使用变量 -->
  <input type="text" name="genre" value="<%= genre %>">
  

内容的提问来源于stack exchange，提问作者spider