Data not showing on Handlebars - node.js

Question

I have the script below which extracts the data from MongoDB:
router.get("/visualizarinscritos/:id", eEmpresa, (req,res)=>{
result = []
Vaga.findOne({_id: req.params.id}).then((vaga)=>{
//console.log(Object.values(JSON.parse(JSON.stringify(vaga.candidatos))))
Curriculo.find().then((curriculo)=>{
if(curriculo){
for(var r = 0; r < vaga.candidatos.length ; r++){
for(var i = 0; i < curriculo.length; i++){
if(vaga.candidatos[r] == curriculo[i].usuario){
result.push(curriculo[r])
}
}
}
res.render("empresa/viewcurriculos", {curriculo: result})
}else{
req.flash("error_msg", "Não há curriculos relacionados")
res.redirect("/empresa/vagas")
}
}).catch((err)=>{
req.flash("error_msg", "Houve um erro ao buscar usuários relacionados a vaga: "+err)
res.redirect("/empresa/vagas")
})
}).catch((err)=>{
req.flash("error_msg", "Houve um erro ao carregar vaga: "+err)
res.redirect("/empresa/vagas")
})})
I'm receiving the data as expected. I did a console.log and I'm getting it correctly:
[ {
_id: 60cabfad6494450bd0065877,
usuario: 60cabebfd90f8427c4840990,
experiencia: 'SAP Concur Reporting Analyst\r\n' +
'SAP SE | 07/22/2019 - Current.\r\n' +
'Support and develop reports on IBM Cognos\r\n' +
'\r\n' +
'Support team questions and handle issues\r\n' +
'\r\n' +
'Teach new colleagues\r\n' +
'\r\n' +
'Translate documents to Portuguese, English or Spanish.\r\n' +
'\r\n' +
'Create and support system automations\r\n' +
'\r\n' +
'Trilingual Service Desk Senior\r\n' +
'HCL Technologies | 02/27/2019 – 07/19/2019\r\n' +
'Teach news Service Desk Analyst\r\n' +
'\r\n' +
'Teach and remainder the team about process and new process or applications\r\n' +
'\r\n' +
'Answer the questions that the Analyst of Service Desk can ask\r\n' +
'\r\n' +
'Learn and participate of migrations of new applications\r\n' +
'\r\n' +
'Work on tickets that have a big priority\r\n' +
'\r\n' +
'Help key users solving problems and answering questions\r\n' +
'\r\n' +
'Verify the tickets that Service Desk done something and escalate it if necessary\r\n' +
'\r\n' +
'Bilingual Service Desk\r\n' +
'HCL Technologies | 05/22/2017 – 02/27/2019\r\n' +
'Support on applications that are homologated and used by the client\r\n' +
'\r\n' +
'Remote support on softwares\r\n' +
'\r\n' +
'Support on applications that are homologated and used by the client, O.S, networks and telecom\r\n' +
'\r\n' +
'improve the Knowledge base\r\n' +
'\r\n' +
'Answer emails, calls and chats according the demands\r\n' +
'\r\n' +
'Manage tickets\r\n' +
'\r\n' +
'Internship – Maintenance of computers and networks\r\n' +
'QI Escolas & Faculdades | 09/14/2016 - 05/18/2017\r\n' +
'Administrative routines\r\n' +
'\r\n' +
'Servers maintenance\r\n' +
'\r\n' +
'Maintenance of cabling and switch\r\n' +
'\r\n' +
'Remote support on applications\r\n' +
'\r\n' +
'Local support on hardware and Telecom area.',
educacao: 'Associate in Analysis and Systems Development\r\n' +
'Unisinos | 2017/2 - Current.\r\n' +
'\r\n' +
'IT\r\n' +
'QI Escolas & Faculdades | Completed at 2017',
certificacao: '>\r\n' +
'ITIL\r\n' +
'\r\n' +
'>\r\n' +
'Active Directory\r\n' +
'\r\n' +
'>\r\n' +
'Exchange\r\n' +
'\r\n' +
'>\r\n' +
'Windows Server and OS\r\n' +
'\r\n' +
'>\r\n' +
'Network maintenance/management\r\n' +
'\r\n' +
'>\r\n' +
'Hardware',
idioma: 'Porguese\r\n\r\nEnglish\r\n\r\nSpanish\r\n\r\nLIBRAS',
habilidades: 'Java\r\n' +
'\r\n' +
'SQL\r\n' +
'\r\n' +
'HTML/CSS\r\n' +
'\r\n' +
'JavaScript\r\n' +
'\r\n' +
'EJS\r\n' +
'\r\n' +
'NodeJS\r\n' +
'\r\n' +
'Android\r\n' +
'\r\n' +
'Angular\r\n' +
'\r\n' +
'PHP\r\n' +
'\r\n' +
'Cognos',
outros: 'Github: https://github.com/gabdonada\r\n\r\nFuncionou?',
__v: 0},undefined]
However, when trying to get the data using the Handlebars code below, the page is not showing values:
{{#each curriculo}}
<div class="card">
<div class="card-body">
<h4>{{curriculo.usuario.nome}}</h4>
<h4>{{experiencia}}</h4>
<small>Sobre: {{curriculo.experiencia}}</small><br>
<button class="btn btn-success">Visualizar Curriculo</button>
</div>
</div>
{{else}}
<h4>Não há curriculos registrados</h4>
{{/each}}
I tried by using and not using Each, but still not working. Do you know how to fix this?

Answer 1

Within an #each block, you need to use this to access the current array item. Therefore you should change your code to:
{{#each curriculo}}
<div class="card">
<div class="card-body">
<h4>{{this.usuario.nome}}</h4>
<small>Sobre: {{this.experiencia}}</small><br>
<button class="btn btn-success">Visualizar Curriculo</button>
</div>
</div>
{{else}}
<h4>Não há curriculos registrados</h4>
{{/each}}

Answer 2

The solution for this case is adding Async + Promise, as below. The res.render was redirecting to the page before the code completes. I also used .lean():
Router.get("/visualizarinscritos/:id", eEmpresa, (req,res)=>{
var result = []
Vaga.findOne({_id: req.params.id}).lean().then((vaga)=>{
Curriculo.find().lean().then( async (curriculos)=>{
if(curriculos){
const promises = []
for(const candidato of vaga.candidatos){
for(const curriculo of curriculos ){
promises.push(
new Promise((resolve) => {
if(candidato == curriculo.usuario){
result.push(curriculo)
}
resolve(candidato)
})
)
}
}
Promise.all(promises).then((resposta) => {
console.log(result)
console.log(result.usuario)
res.render("empresa/viewcurriculos", {teste: result})
})
}else{
req.flash("error_msg", "Não há curriculos relacionados")
res.redirect("/empresa/vagas")
}
}).catch((err)=>{
req.flash("error_msg", "Houve um erro ao buscar usuários relacionados a vaga: "+err)
res.redirect("/empresa/vagas")
})
}).catch((err)=>{
req.flash("error_msg", "Houve um erro ao carregar vaga: "+err)
res.redirect("/empresa/vagas")
})
})