javascript - 按照 EJS 中的 If 条件给出样式

Question

<% docs.forEach( function ( doc ){ %>

<div class="item">
    <% if (doc.Active) { %>
    <style> .item { background-color:red }</style>
    <% } %>
</div>

<% }); %>

假设有 3 个文档，

doc1 (Active == true)
doc2 (Active == true)
doc3 (Active == false)

我只想给 Active == true 样式。我像上面那样编码，但结果是每个 div 都被赋予了样式。所以最后都是红色背景，这不是我所期望的。

如何在 EJS 中有条件地提供样式？

Answer 1

您可能希望有条件地设置一个类似 .active 的类，并将其与您的 CSS 样式(例如红色背景颜色)一起使用。像这样:

<% docs.forEach(function (doc) { %>    
  <div class="item <%= doc.Active ? 'active' : '' %>"></div>
<% }); %>