logo标签列表

无法读取未定义的属性"title"。Express

node.jsmongodbexpress
7

你好，我正在开发一个基于Node.js和Express的应用程序。我遇到了一个异常问题，但不知道出了什么问题。在我的看来，一切似乎都很完美。以下是我的异常信息：

 500 TypeError: C:\Nodejs\NodejsBlog\apps\blog/views/postdetail.jade:23<br/> 21| .col- md-12 <br/> 22| .posts <br/> > 23| h3= post.title <br/> 24| p=post.body <br/> 25| p tag:      <br/> 26| i=post.tag <br/><br/>Cannot read property 'title' of undefined
21| .col-md-12
22| .posts
> 23| h3= post.title
24| p=post.body
25| p tag:
26| i=post.tag
Cannot read property 'title' of undefined
at eval (eval at (C:\Nodejs\NodejsBlog\node_modules\jade\lib\jade.js:152:8), :221:59)
at C:\Nodejs\NodejsBlog\node_modules\jade\lib\jade.js:153:35
at Object.exports.render (C:\Nodejs\NodejsBlog\node_modules\jade\lib\jade.js:197:10)
at Object.exports.renderFile (C:\Nodejs\NodejsBlog\node_modules\jade\lib\jade.js:233:18)
at View.exports.renderFile [as engine] (C:\Nodejs\NodejsBlog\node_modules\jade\lib\jade.js:218:21)
at View.render (C:\Nodejs\NodejsBlog\node_modules\express\lib\view.js:76:8)
at Function.app.render (C:\Nodejs\NodejsBlog\node_modules\express\lib\application.js:504:10)
at ServerResponse.res.render     (C:\Nodejs\NodejsBlog\node_modules\express\lib\response.js:798:7)
at C:\Nodejs\NodejsBlog\apps\blog\routes.js:64:14
at callbacks (C:\Nodejs\NodejsBlog\node_modules\express\lib\router\index.js:164:37)

以下是app.post的代码：

app.get('/Post/:id',function(req,res){
    var postdata;
    var comments;
    Post.findOne({_id:req.params.id},function(err, docs){
            if(docs) {
                postdata=docs;  
                console.log('Gönderi bulundu');
                console.log(docs);
                console.log(postdata);
                console.log(postdata.title);
            } else {

                console.log('Gönderi bulunamadı');
            }
        });

        Comment.findOne({postid:req.params.id},function(err, docs){
            if(docs) {
                console.log('Yorum bulundu');
                console.log(docs);
            } else {
                comments=docs;  
                console.log('Yorum bulunamadı');
            }
        });

    return res.render(__dirname+"/views/postdetail",{
            title: 'adfasdf',
            stylesheet: 'postdetail',
            post:postdata,
            comments:comments
            });
});

我的观点是：
extends ../../../views/bloglayout
block js
script(type='text/javascript')
    $(function() {
        $("#commentform" ).submit(function( event ) {
            alert( "Handler for .submit() called." );
            $.ajax({
                url: '/Post/Comment/',
                type: "POST",
                data: $('#commentform').serialize(),
                success: function(response){
                alert('Yorum Kaydedildi');
                }
            }); 
            event.preventDefault();
        });
    });

block content
.row
    .col-md-12
        .posts
            h3=post.title
            p=post.body
            p tag:
                i=post.tag
            p Anahtar Kelimeler:
                b=post.keywords
        .row
            .col-md-4
                h5 Yorum Yap
                  form#commentform(role='form',action='/Post/Comment', method='post')
                            input(type='hidden',name='comment[postid]',value=postdata._id)
                        .form-group
                            input.form-control(type='email',name='comment[email]',placeholder='E-posta adresi')
                        .form-group
                            input.form-control(type='text',name='comment[website]', placeholder='Website')
                        .form-group
                            textarea.form- control(type='text',name='comment[content]', placeholder='Yorum')
                        button.btn.btn-  default(type='submit') Ekle
                -comments.forEach(function(comment) {
                .well
                    p
                        b=comment.content
                    p=comment.email
                -})

我检查了我的 MongoDB 数据库，有数据存在。但是不知道为什么 'title' 属性的值是 'undefined'，没有任何想法。

你能同时添加视图文件的代码吗？ - srquinn
添加了问题视图。 - ftdeveloper
你确定日志中没有 'Gönderi bulunamadı' 吗？看起来 docs 变量是 null... - MarcoL
我很确定。在我的日志中没有“Gönderi bulunamadı”。 - ftdeveloper
3个回答
4

这是一个竞态条件问题。从MongoDB中提取数据的两个函数是异步的，因此在每个函数的回调中调用res.render()之前，DB返回数据。您需要嵌套每个函数，以便它们可以访问正确的上下文。请参见以下内容：

app.get('/Post/:id', function (req, res, next){
  Post.findOne({_id:req.params.id},function(err, postData){
    if (err) return next(err);  

    Comment.findOne({postid:req.params.id},function(err, comments){
      if (err) return next(err);

      return res.render(__dirname+"/views/postdetail",{
        title: 'adfasdf',
        stylesheet: 'postdetail',
        post:postData,
        comments:comments
      });

    });
  });
});

然而，当你嵌套越来越深时，你会发现这很容易变得混乱。为了防止这种情况发生，您可以使用像caolan/async这样的控制流库。

附注：

如果您的Jade正在迭代一个 comments 数组，并且您从MongoDB返回单个文档（假设您正在使用 mongoose 模块），您将需要将Mongoose函数从findOne() 更改为简单的find()，以便mongoose可以返回具有正确 postid 的文档数组。

编辑：

Vinayak Mishra也指出，您可以使用Express的路由中间件作为在路由中实施控制流的方法。下面是一个示例：

// Use the app.param() method to pull the correct post doc from the database.
// This is useful when you have other endpoints that will require work on
// a Post document like PUT /post/:postid
app.param('postid', function (req, res, next, id) {

  Post.findById(id, function (err, post) {
    if (err) return next(err);
    if (!post) return next('route');
    req.post = post;
  });

});

app.get('/post/:postid',
  // -- First route middleware grabs comments from post doc saved to req.post
  function (req, res, next) {
    Comment.find({ postid: req.post.id }, function (err, comments) {
      if (err) return next(err);
      req.comments = comments;
      next();
    });
  },
  // -- This route middleware renders the view
  function (req, res, next) {
    res.render('/postDetail', {
      // ... list locals here ...
    });
  }
);
谢谢，问题已经解决。我还更新了我的代码。现在使用find()方法来获取评论。你是对的。 - ftdeveloper
1
在应用的 app.js（server.js）或根文件中添加此内容以进行请求。
app.use(express.json());

app.use(express.urlencoded({ extended: false }));

在你的路由上添加这两个中间件。请保留 HTML，不要进行解释。
0

从数据库中获取数据的两个例程是异步例程，因此它们的回调在您触发res.render()时不会被调用。您需要等待查询返回结果，然后调用render。

您可以利用中间件在准备好渲染帖子之前按顺序获取帖子和评论。

这里有一个示例；

app.get('/Post/:id', fetchPost, fetchComments, renderPost, handleErrors);

function fetchPost(req, res, next) {
  Post.findOne({
    _id: req.params.id
  }, function (err, docs) {
    if (!err && docs) {
      console.log('Gönderi bulundu');
      req.postdata = docs;
      next();
    } else {
      console.log('Gönderi bulunamadı');
      next(err || new Error('No such post: ' + req.params.id));
    }
  });
}

function fetchComments(req, res, next) {
  Comment.findOne({
    postid: req.params.id
  }, function (err, comments) {
    if (!err) {
      console.log('Yorum bulundu');
      req.postComments = comments || [];
      next();
    } else {
      console.log('Yorum bulunamadı');
      next(err);
    }
  });
}

function renderPost(req, res, next) {
  res.locals.post = req.postdata;
  res.locals.comments = req.postComments;
  res.locals.title = 'adfasdf - anything that fits';
  res.locals.stylesheet = 'postdetail';
  return res.render(__dirname + '/views/postdetail');
}

function handleErrors(err, req, res, next) {
  // You'll get here only if you recieved an error in any of the previous middlewares
  console.log(err);

  // handle error and show nice message or a 404 page
  res.locals.errmsg = err.message;
  res.render(__dirname + '/views/error');
}

如果您无法理解上述代码，请告诉我。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接