EJS条件语句更改CSS

我在EJS循环，我想根据我的数据设置CSS：

<% dummies.forEach(function(dummy) { %> <div class="panel panel-???"> </div> <% }) %> 

我的资料：

 var dummies = [{ type: "funny", sure: "Yes" // this should generate panel-success }, { type: "funny", // this should generate panel-a sure: "No" }, { type: "happy", // this should generate panel-b sure: "No", }]; 

所以只要sure属性是Yes ，它就会生成panel-success 。 否则，它会根据type属性生成CSS。

请帮忙。

Answer 1

首先创build这样的对象：

 <% let cssClass = { funny: { Yes: "success", No: "a" }, happy: { No: "b" } } %> 

那么你应该只在模板中输出值：

 <% dummies.forEach(function(dummy) { %> <div class="panel panel-<%= cssClass[dummy.type][dummy.sure] %>"> </div> <% }) %> 

Answer 2

尝试使用此代码…

  <% dummies.forEach(function(dummy) { %> <div class="panel panel- <% if (dummy.sure==="yes") { %> success <% else %> <%= dummy.type %> > </div> <% }) %> 

您可以将您的逻辑封装在EJS运算符中。 它看起来有点混乱，但它是什么。 根据服务器端的设置，也可以从服务器端传入参数，而不是在客户端执行逻辑。

最好的方法将取决于在数据库访问和其他任何逻辑上进行繁重的工作。