Didn't get any dynamic content on web page using view/template engine (Handlebars)

I am using Handlebars template engine. Not getting any error at console but I am not able to display dynamic content in the index.hbs file which is rendered from app.js

app.js

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

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

app.use(express.urlencoded({extended:true}));   //to get the html form data

app.use(express.static('./public'));

app.use(express.json());

app.get('/',(req,res)=>{
    
    res.render('index.hbs'); 

});

app.post('/', async (req,res)=>{

   const currentCity = req.body.city; 
   
   let WRAP_DATA = await getCityWeather(currentCity);  //getCityWeather function return weather by city
   
   console.log('Weather Info = ',WRAP_DATA); // successfully got the WRAP_DATA 
   
   res.render('index.hbs',{WRAP_DATA});
});

At console I got WRAP_DATA successfully

description: 'overcast clouds',
humidity: 53,
visibility: 10,
windSpeed: 2.592,
winddeg: 32

index.hbs

"It is located inside view folder and display HTML&CSS properly only problem is replacing dynamic data". I am mentioning code where I used hbs tags only.

<table>
                <tr class="detail">
                    <td> <img src="../img/humidity.png" class="desc_icon"> </td>
                    <td class="label">Humidity</td>
                    <td class="value">  %</td>
                </tr>
                <tr class="detail">
                    <td> <img src="../img/visibility.png" class="desc_icon"> </td>
                    <td class="label">Visibility</td>
                    <td class="value">  km</td>
                </tr>
                <tr class="detail">
                    <td> <img src="../img/windspeed.png" class="desc_icon"> </td>
                    <td class="label">Wind Speed</td>
                    <td class="value">  km/h</td>
                </tr>
                <tr class="detail">
                    <td> <img src="../img/direction.png" class="desc_icon"> </td>
                    <td class="label">Wind Direction</td>
                    <td class="value">  °</td>
                </tr>
</table>

when I run my project my backend works fine but above mentioned WRAP_DATA values are not displaying at their position in index.hbs



Comments

Popular posts from this blog

Spring Elasticsearch Operations

Object oriented programming concepts (OOPs)

Network Error and Timeout on Authorize.net JS