給風格下如果EJS

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> 
<% }); %> 

Answer 2

的語法是：

<style> .item { background-color:red; } </style> 

，並只設置到的項目只有一個，使用：

<style> 
    .active { background-color:red; } 
</style> 

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

<% if (doc.Active) { %> 
    <div class="item acitve"> 
<% } else { %> 
    <div class="item"> 
<% } %> 

    ... 

    </div> 

<% }); %>