Regis Zaleman
Regis Zaleman

Reputation: 3240

Can I use conditional statements with EJS templates (in JMVC)?

and if yes, what is the syntax? My goal is to prepend an 's' to the word 'comment' when there is more than one. in an jQuery.ejs template in a JMVC app. The following breaks. I can't find any docs for conditionals...

<%=commentsNumber%> comment<% if (commentsNumber > 1) { %> s <% } %>

Upvotes: 146

Views: 288631

Answers (8)

 Shahidullah Muffakir
Shahidullah Muffakir

Reputation: 41

one simple and general rule for embedding javascript for example (for loops) into our ejs template we can follow the following rule:

  1. first write your javascript code in the ejs template as you normally write in the javascript.

  2. put the <% in the start and %> in the end of every pure javascript line.

for example:

if (num%2===0) {
    <p> this is an even number</p>
} else { 
<p> this is an odd number</p>
}

so now we have to put the ejs syntax in every line :

 <% if (num%2===0) {%>
    <p> this is an even number</p>
<%} else { %>
<p> this is an odd number</p>
<%}%>

Upvotes: 4

xetryDcoder
xetryDcoder

Reputation: 157

Just making code shorter you can use ES6 features. The same things can be written as

app.get("/recipes", (req, res) => {
    res.render("recipes.ejs", {
        recipes
    });
}); 

And the Templeate can be render as the same!

<%if (recipes.length > 0) { %>
// Do something with more than 1 recipe
<% } %>

Upvotes: 2

Achintha Isuru
Achintha Isuru

Reputation: 3307

I know this is a little late answer,

you can use if and else statements in ejs as follows

<% if (something) { %>
   // Then do some operation
<% } else { %>
   // Then do some operation
<% } %>

But there is another thing I want to emphasize is that if you use the code this way,

<% if (something) { %>
   // Then do some operation
<% } %>
<% else { %>
   // Then do some operation
<% } %>

It will produce an error.

Hope this will help to someone

Upvotes: 9

Om Prakash Sharma
Om Prakash Sharma

Reputation: 1840

Yes , You can use conditional statement with EJS like if else , ternary operator or even switch case also

For Example

Ternary operator : <%- role == 'Admin' ? 'Super Admin' : role == 'subAdmin' ? 'Sub Admin' : role %>

Switch Case

<% switch (role) {
case 'Admin' : %>
        Super Admin
        <% break;

case 'eventAdmin' : %>
        Event Admin
        <% break;

case 'subAdmin' : %>
        Sub Admin
        <% break;

} %>

Upvotes: 38

StanleyZheng
StanleyZheng

Reputation: 4138

Conditionals work if they're structured correctly, I ran into this issue and figured it out.

For conditionals, the tag before else has to be paired with the end tag of the previous if otherwise the statements will evaluate separately and produce an error.

ERROR!

<% if(true){ %>
   <h1>foo</h1>
<% } %>
<% else{ %>
   <h1>bar</h1>
 <% } %>

Correct

<% if(true){ %>
   <h1>foo</h1>
 <% } else{ %>  
   <h1>bar</h1>
<% } %>

hope this helped.

Upvotes: 250

pzrq
pzrq

Reputation: 1907

You can also use else if syntax:

<% if (x === 1) { %>
    <p>Hello world!</p>
<% } else if (x === 2) { %>
    <p>Hi earth!</p>
<% } else { %>
    <p>Hey terra!</p>
<% } %>

Upvotes: 22

Jbird
Jbird

Reputation: 2886

For others that stumble on this, you can also use ejs params/props in conditional statements:

recipes.js File:

app.get("/recipes", function(req, res) {
    res.render("recipes.ejs", {
        recipes: recipes
    });
});

recipes.ejs File:

<%if (recipes.length > 0) { %>
// Do something with more than 1 recipe
<% } %>

Upvotes: 190

EJS seems to behave differently depending on whether you use { } notation or not:

I have checked and the following condition is evaluated as you would expect:

<%if (3==3) {%>  TEXT PRINTED  <%}%>
<%if (3==4) {%>  TEXT NOT PRINTED  <%}%>

while this one doesn't:

<%if (3==3) %>  TEXT PRINTED  <% %>
<%if (3==4) %>  TEXT PRINTED  <% %>  

Upvotes: 24

Related Questions