Pass a variable from javascript to ejs

javascript node.js express ejs

30,746

Solution 1

Here's a very simple example on how app.locals can be used to expose variables to (EJS) templates:

// app.js
var express = require('express');
var app     = express();
var server  = app.listen(3000);

app.locals.myVar = 1;

app.get('/', function(req, res) {
  res.render('index.ejs');
});

// views/index.ejs
<% if (myVar) { %>
  <h1>myVar is here!</h1>
<% } else { %>
  <h1>Boohiss no myVar!</h1>
<% } %>

Solution 2

The app.locals.myVar approach should work, so something must be getting in the way. But you could avoid using app.locals.myVar altogether and pass variables directly to your views with:

var express = require('express');
var app = express();

app.get('/', function(req, res) {
    var myVar = 1;
    res.render('testPage', { myVar : myVar });
});

The myVar variable should now be available to the "testPage" ejs file. Inside of it you could do:

<%= myVar %>

And see it output "1".

Lastly, make sure you have set the view engine to ejs:

app.set('view engine', 'ejs');

Otherwise it won't work.

30,746

Author by

George

Updated on July 09, 2022

Comments

George almost 2 years
I want to use a variable which is declared in javascript file to a ejs file.

javascript:
```
var express = require('express');
var app = express();

var myVar = 1;
```
In the ejs file , where I want to use that variable inside a few if statements ,I have to declare it again in order to be able to use it.

ejs file:
```
var myVar = 1;
if ( my Var ) ....
```
How can I avoid this?Or is there a way for creating a configuration file which is accesible from both javascript and ejs?

I tried also to use:

app.locals.myVar = 1

but it is undefined in the ejs file.

------- UPDATE --------------------------

In my code I am using:
```
app.get('/', function (req, res) {
    res.render('index', { user : req.user, message: [] });

});
```
after using the app.locals:
```
app.get('/', function (req, res) {

   res.render('index', { user : req.user, message: [] });
   res.render('user_info.ejs');
```
});

and even though the code runs fine , I am receiving:
```
ReferenceError: ....user_info.ejs:18

 >> 18|            height:60px;


user is not defined
    at eval (eval at <anonymous> (...node_modules/ejs/lib/ejs.js:464:12), <anonymous>:20:12)

    at returnedFn (...node_modules/ejs/lib/ejs.js:493:17)
    at View.exports.renderFile [as engine] (.../node_modules/ejs/lib/ejs.js:350:31)
   .....
```
which doesn't make sence ,since as I said the code runs fine.And If I run it without the addition of the second res.render('user_info.ejs) I receive no errors.

So, can I have two res.render statements?
George almost 8 years

:Hmm..Can I ask you , if I also have res.render('index', { user : req.user, message: [] }); how can I write properly the 'index.ejs'?I mean , i am trying : app.get('/', function (req, res) { res.render('index', { user : req.user, message: [] }); res.render('index.ejs'); }); but it gives me some weird reference error in index.ejs although it works ok.
George almost 8 years

:Sorry to insist..In a few words I have 2 res.render statements in app.get('/').Even though it works , it gives me the reference error above.Can you let know if this is possible?Thanks..
robertklep almost 8 years

@George perhaps create a new question for this? Or is the error the same as you got before? If so, can you add the exact error that you're getting to your original question?
robertklep almost 8 years

@George first: calling res.render() two times will not work. Second, I'm going to guess that req.user isn't defined, which would make the user variable inside the template undefined. This would point to an issue in your app that relates to authentication, and not so much templating.
George almost 8 years

:But if I run it without the res.render('user_info.ejs' ) I receive absolute no errors about req.user.Is there a way to use the app.locals.myVar without putting it into render?
robertklep almost 8 years

@George but you're not declaring a variable named user when you render user_info.ejs, like you do with rendering index (the second argument, { user : req.user, ... }), so no wonder that you're getting a reference error about it.
George almost 8 years

:Yes,you are right.The thing is how can I combine these 2 renders?something like.But I have 2 different files.