onsubmit breakks Yeşim görünümü

Question

Bazı girişler alan, verileri mongo'da saklayan ve verileri formun altındaki görünüme döndüren bir form sayfam var. Ancak, bir kullanıcı formu, yeşim görünümü çöker üzerine yeni veri gönderir ve aşağıdaki hata görüntüler zaman:

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 

beklenen davranıştır kullanıcı formu ile yeni veri gönderdiğinde, bu formun altına görüntüler olmasıdır. Neden Entry neden tanımsız hale gelir, ancak veriler gönderilmeden önce hala görüntülenir?

Yönlendirici

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

Jade

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 

Mesaj fonksiyonu

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; 
}); 

Answer 1

sizin router.post işleyicisindeki Eğer Jade'i tedarik etmediklerinden girişleri yeniden göndermeyle üzerine tanımlanmamış nedeni budur Bu değişken için bir değer içeren şablon. içinde,

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

Gördüğünüz gibi: Şimdi

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

, router.get işleyicisi başarılı koduna bu karşılaştırma: Burada

bu neden sizin router.post işleyicisindeki kodudur router.get işleyici, Jade şablon altyapısını "entries" değişkeni için entries değerine sağladığından, mongodb yapmak için yaptığınız çağrıyla döndürülen değerdir.

Daha fazla bilgi için the express docs for res.render()'a bakmaya değer olabilir. İşte situtation bazı ışık tutuyor Söz konusu alıntı: yanlış gittiğini

locals Tartışmanın tanımından

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

Renders a view and sends the rendered HTML string to the client. Optional parameters:

locals , an object whose properties define local variables for the view.

görebilirsiniz! Mutlu kodlama :)