Pug - 尝试遍历 json 对象时无法读取未定义的属性“长度”答案

【问题标题】：Pug - Cannot read property 'length' of undefined when trying to iterate through json objectsPug - 尝试遍历 json 对象时无法读取未定义的属性“长度”
【发布时间】：2019-02-24 02:56:06
【问题描述】：

我正在尝试在我的网页上显示通过 mongoose 从我的数据库中检索到的所有结果，但我在我的 index.pug 文件中不断收到“Cannot read property 'length' of undefined”，我在该文件中编写了我的 each 循环以迭代json 对象的返回光标，以便我可以显示它们。我是表达、猫鼬和哈巴狗的新手，所以我很难弄清楚我的错误。

这是我的index.pug 文件的 sn-p：

section(class="get")
h3 Get Data
a(href="/get-data") LOAD DATA
div
  each val in items
    article(class="item")
      div Title: #{val.title}
      div Content: #{val.content}
      div Author: #{val.author}
      div ID: #{val._id}

items 应该由猫鼬从下面的express.js sn-p 我的index.js 文件中传递：

router.get('/get-data', function(req, res, next) {
  // Use mongoose to find data from database
  UserData.find()
     .then(function(doc) {
       res.render('index', {items: doc});
     });
});

当我尝试加载网页时遇到此错误：

无法读取未定义的属性“长度”

详细信息指向我的每个循环的行：

21|     a(href="/get-data") LOAD DATA
22|     div
23|  >    each val in items
24|         article(class="item")
25|           div Title: #{val.title}
26|           div Content: #{val.content}

对此问题的任何见解将不胜感激。谢谢！

【问题讨论】：

好像你的items 数组是undefined。您可以在GET /get-data 方法中添加console.log(doc) 并重现行为（并查看日志是否有效）？
@oneturkmen 我已经在 res.render() 调用之前插入了该行。我应该在哪里看到输出？
应该在你的控制台/终端上（无论你在哪里 npm start 或 node server.js）
@oneturkmen 我假设我正在寻找控制台的 json 输出？但是，我得到的只是一些如下所示的 GET 请求：GET / 500 266.035 ms - 3051 GET /stylesheets/style.css 304 1.985 ms - - GET /stylesheets/style.css 304 0.511 ms - -
还有一些关于未处理的承诺拒绝的警告，我不明白

标签： node.js express mongoose pug

【解决方案1】：

我从来没有机会找出究竟是什么导致了这个问题。找出原因后，我会更新我的答案。但这是解决办法。

我的感觉是哈巴狗在未初始化时会尝试使用“项目”。一旦在后续渲染中初始化，它将起作用。所以尝试像这样添加条件运算符

     a(href="/get-data") LOAD DATA
     div
        each val in items ? items : [] 
          article(class="item")
            div Title: #{val.title}
            div Content: #{val.content}

当 pug 尝试使用未定义的项目呈现页面时，这根本不会导致错误。

一旦我发现这背后的原因，我会更新我的答案。希望我的管道胶带解决方案能为您完成工作。

【讨论】：

也为我解决了。后来我尝试将其删除并重新启动节点服务器并正常工作。好像我忘记停止服务器并重新启动它。

【解决方案2】：

您在查询数据库时一定有一些问题，您必须在使用检索到的结果之前检查查询是否成功。因为您使用 Promise 获得结果，所以您可以在 then 之后添加 catch 以捕获将引发的任何错误

router.get('/get-data', function(req, res, next) {
  // Use mongoose to find data from database
    UserData.find({})
        .then(function(doc) {
           res.render('index', {items: doc});
        })
        .catch(function(error){
            console.log(error);
        });
});

【讨论】：