How to use Javascript Variables in Jade Template?

Question

I am using IBM Bluemix to make a web service for a school project.

My project needs to request a JSON from an API, so I can use the data it provides.

I want the Jade Template to write strings using the data that come from the API, but I can't use the variables that are defined in my .js file.

For instance, I would like to write

"Your Exchange Rate is"+CotacaoDolar

in the h1 field of the jade file, being "CotacaoDolar" a variable defined in the .js file.

How could this be done?

Here is my .js file:

/*eslint-env node*/

//------------------------------------------------------------------------------
// node.js starter application for Bluemix
//------------------------------------------------------------------------------

// HTTP request - duas alternativas
var http = require('http');
var request = require('request');

// cfenv provides access to your Cloud Foundry environment
// for more info, see: https://www.npmjs.com/package/cfenv
var cfenv = require('cfenv');

//chama o express, que abre o servidor
var express = require('express');

// create a new express server 
var app = express();

// serve the files out of ./public as our main files
app.use(express.static(__dirname + '/public'));

// get the app environment from Cloud Foundry
var appEnv = cfenv.getAppEnv();

// start server on the specified port and binding host
app.listen(appEnv.port, '0.0.0.0', function() {
    // print a message when the server starts listening
    console.log("server starting on " + appEnv.url);
});


app.get('/home1', function (req,res) {
    http.get('http://developers.agenciaideias.com.br/cotacoes/json', function (res2) {
        var body = '';
        res2.on('data', function (chunk) {
            body += chunk;
        });
        res2.on('end', function () {
            var json = JSON.parse(body);
            var cotacao = json["bovespa"]["cotacao"];
            var CotacaoDolar = json["dolar"]["cotacao"];
            var VariacaoDolar = json["dolar"]["variacao"];
            var CotacaoEuro = json["euro"]["cotacao"];
            var VariacaoEuro = json["euro"]["variacao"];
            var Atualizacao = json["atualizacao"];
			
			res.render('cotacao_response.jade', {
                 message: 'A taxa de câmbio é de '+CotacaoDolar+' R$.Esse valor corresponde ao preço de venda em '+Atualizacao
            });
        });
    });
});

Here is my .jade file:

doctype html
html(lang="en")
  head
    title Cotação 
    link(rel='stylesheet',href='stylesheets/style.css')
  body
    h1!=message
    #container.col
      p Seu câmbio foi.
      p.

Carlos Sultana · Accepted Answer · 2015-12-05 21:21:56Z

3

You just need to pass in an object when rendering the template which holds your variables. The value is then accessible by referencing the key in your Jade template. So to send your variable 'CotacaoDolar' you would pass in the object as such:

res2.render('cotacao_response.jade', {
    'CotacaoDolar': CotacaoDolar
});

Then in your Jade template you can create the h1 like:

h1 Your exchange rate is #{CotacaoDolar}

answered Dec 5, 2015 at 21:21

Carlos Sultana

7295 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to use Javascript Variables in Jade Template?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related