提交中断玉视图

我有一个表单页面需要一些input,将数据存储在mongo中,并将数据返回到表单下的视图。 但是,当用户在表单上提交新的数据时,玉视图崩溃并显示以下错误:

TypeError: /Users/rhysedwards/Downloads/insightful/food/views/index.jade:29 27| label 28| input.btn.btn-default(name='submit', type='submit', onsubmit="this.submit(); this.reset(); return false;") > 29| each Entry, i in entries 30| div.title= Entry.title 31| div.url= Entry.url 32| div.selectedDate= Entry.selectedDate Cannot read property 'length' of undefined 

预期的行为是当用户通过表单提交新数据时,它会显示在表单下方。 为什么Entry在提交时变得未定义,但数据在提交之前仍然显示?

路由器

 router.get('/', function(req, res, next){ Entry.find({}, function (err, entries) { res.render('index', { "entries": entries }); }); }); 

 block content .container h1 London Plans form(method='post' action='post', class='plans', id='plans') .form-group label Do you have a link? input.form-control(name='search', id='search' type='url', required='required') h2#title .form-group label What looks cool? input.form-control(name='title', type='text', required='required' class='title') .form-group label When is it? label input(type='checkbox' name='week' value='week') span This week label input(type='checkbox' name='month' value='month') span This Month label input(type='checkbox' id='date') span Date label input(type='textbox' class='datepicker' name='date' value='') label input.btn.btn-default(name='submit', type='submit', onsubmit="this.submit(); this.reset(); return false;") each Entry, i in entries div.title= Entry.title div.url= Entry.url div.selectedDate= Entry.selectedDate 

发布function

 router.post('/post', function(req, res, next) { var url = req.body.search; var title = req.body.title; var week = req.body.week; var month = req.body.month; var date = req.body.date; console.log(url + ' ' + title + ' ' + week + ' ' + month + ' ' + date); //FIND WHICH DATE WAS SELECTED BY USER AND ASSIGN THAT TO selectedDate if (typeof week != 'undefined' ){ var selectedDate = 'week'; } else if (typeof month != 'undefined') { var selectedDate = 'month'; } else { var selectedDate = date; }; //CREATE NEW OBJECT var data = new Entry ({ url: url, title: title, selectedDate: selectedDate }) //STORE NEW OBJECT TO THE DB Entry.createEntry(data, function(err, entry){ if (err) throw err; console.log(entry); }) //RENDER THE HOMEPAGE TO CLEAR THE FORM res.render('index'); return false; }); 

重新提交时条目未定义的原因是因为在您的router.post处理程序中,您不提供Jade模板的值为该variables。

这里是你的router.post处理程序中的代码,它导致了这一点:

 res.render('index'); // telling the page to render without variables 

现在,将其与router.get处理程序中的成功代码进行比较:

 res.render('index', { "entries": entries // here is where you assign variables for Jade }); 

正如你所看到的,在router.get处理程序中,您将为Jade模板引擎提供一个"entries"variables的值,这些variables是由您对mongodb调用返回的值。

有关详细信息,请res.render()的快速文档 。 以下是有关这个问题的摘录:

res.render(view [, locals] [, callback])

呈现视图并将呈现的HTMLstring发送到客户端。 可选参数:

locals ,一个对象的属性定义视图的局部variables。

locals说法来看,你可以看到你出错的地方! 快乐编码:)