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. 

Answer 1

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}