Estoy tratando de crear divs usando un objeto que paso con res.render(). Sin embargo, a veces se crean los divs y otras veces no (si actualizo la página). También uso Bootstrap.
js/expreso:
router.get('/', checkSignIn, function(req, res, next) { db = new sqlite3.Database(file); var tasks = {}; db.serialize(function () { var query = "SELECT tasks.id, tasks.name, tasks.status FROM tasks JOIN users ON users.privilege = tasks.privilege WHERE users.id = '" + req.session.userid + "'"; db.all(query, function (err, rows) { for(i = 0; i < rows.length; i++) { tasks[i] = { name: rows[i].name, status: rows[i].status }; console.log(tasks[i]); } }); }); db.close(); res.render('index', { title: 'Home', css: ['style.css', 'dist/wu-icons-style.css'], username: req.session.username, tasks: tasks }); });horas:
<div class="container"> <div class="row"> <div class="col-md-6"> <div class="panel-group"> {{#each tasks}} <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">{{name}}</h3></div> <div class="panel-body">{{status}}</div> </div> {{/each}} </div> </div> </div> </div> El objeto de tasks se completa correctamente cada vez, de acuerdo con el console.log() que agregué. Así que creo que el problema está en el manillar.
Encontré una solución aquí: los manillares no imprimen {{this}} en cada ayudante , pero no uso this . ./name y ./status , pero no sirvió de nada. ¿Puede alguien ayudarme aquí?
Su problema es javascript asíncrono, no manillar. Su objeto de tasks se está completando, pero está procesando el html antes de eso. Si console.log(tasks) justo después de la posición actual de db.close() , será un objeto vacío. Debe mover la función de renderizado dentro de la llamada a la base de datos:
router.get('/', checkSignIn, function(req, res, next) { db = new sqlite3.Database(file); db.serialize(function () { var query = "SELECT tasks.id, tasks.name, tasks.status FROM tasks JOIN users ON users.privilege = tasks.privilege WHERE users.id = '" + req.session.userid + "'"; db.all(query, function (err, rows) { var tasks = {}; for(i = 0; i < rows.length; i++) { tasks[i] = { name: rows[i].name, status: rows[i].status }; console.log(tasks[i]); } res.render('index', { title: 'Home', css: ['style.css', 'dist/wu-icons-style.css'], username: req.session.username, tasks: tasks }); }); }); db.close(); });