The problem with the concatenation?

Why in div.archive-works__items not displayedarchiveProjectCart(params.projects[i])?
console.log(this.archiveProjectCart(params.projects[i]))
says card is there and filled.

if( spatOut.archive ) {
 this.archiveWrap.innerHTML = ";
 spatOut.archive.forEach(el => {
 this.archiveWrap.insertAdjacentHTML('beforeEnd', this.archiveProjectCarts(el));
})
}
archiveProjectCarts(params) {
 let html = `
 <div class="archive-works__wrap">
 <p class="archive-works__year">${params.year}</p>
 <div class="archive-works__items">`
 for(let i = 0; i < params.projects.length; i++) {
// Here this.archiveProjectCart why it does not display 
this.archiveProjectCart(params.projects[i])
}
`</div>
</div>
`
 return html
}

archiveProjectCart(params) {
 let html = `
 <div class="archive-work">
 <a class="archive-work__name" href="${params.url}">${params.title}</a>
 <p class="archive-work__desc">${params.desc}</p>
</div>
`
 return html;
}
April 7th 20 at 15:25
2 answers
April 7th 20 at 15:27
Solution
O_o
let buf = ";
 for(let i = 0; i < params.projects.length; i++) {
// Here this.archiveProjectCart why it does not display 
 buf += this.archiveProjectCart(params.projects[i])
}
 let html = `
 <div class="archive-works__wrap">
 <p class="archive-works__year">${params.year}</p>
 <div class="archive-works__items">${buf}</div>
</div>
`
 return html
April 7th 20 at 15:29
Solution
Because you're using map() and the concatenation operator
(params.projects || []).map(function(project) {
 return this.archiveProjectCart(project)
})

(params.projects || []).map(project => this.archiveProjectCart(project))


let html = `
 <div class="archive-works__wrap">
 <p class="archive-works__year">${params.year}</p>
 <div class="archive-works__items">` + (params.projects || []).map(project => this.archiveProjectCart(project)) + 
`</div>
</div>
 `

Find more questions by tags JavaScript