Javascript模板文字-函数调用

问题描述

我想知道是否可以在javascript模板文字内调用函数。对于那些不认识https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals的人我有这样的东西：

`<div class="product-card-labels">
    ${statuses.forEach(function(status) { return `<span class="product-card-label">${status.name}</span>` })}
</div>`

如您所见，我想调用array.forEach（），它将返回字符串到模板。

解决方法

您具有模板语法权限，但是在函数调用中未返回任何内容。如果您使用.map和.join输出（而不是返回undefined的{{3}}），它将正常工作。

`<div class="product-card-labels">
    ${statuses.map(function(status) { return `<span class="product-card-label">${status.name}</span>`; }).join('')}
</div>`

javascript literals templates