Passing variable from handlebars to javascript in nodejs

Question

i'm doing a dashboard in nodejs and i have some trouble with understanding how to pass variables from handlebars to my script.

This is my file.js code:

//Servershizzle

var path = require('path');

var express = require('express');

var router = express.Router();

// Ungenutzte Variablen

//var timestamp = [];

//var date = [];

//var WikiRows = [];

//var TimestampSort = [];

//var group_id = [];

//var user_id = [];

//var type = [];

//var results = [];

//var compare = [];

// Für Funktion und Diff benötigt:

var Diff = require('text-diff');

var diff = new Diff(); // options may be passed to constructor; see below

const csv = require('csv-parser');

const fs = require('fs');

var zieltype = [];

var zieltimestamp = [];

var zielgroup_id = [];

var zieluser_id = [];

// Test-Params:

zieltype = 'wiki';

zieltimestampe = '1540383631';

zielgroup_id = '154';

zieluser_id = 'A1pSmv1agwPDvi+ITOoENw==';

//Ausführung für diesen Seitentest:

// Code:

//Funktion um nach Type (Wiki) zu filtern, Variable über "zieltype"

function filterWikiEntries(value) {

    return value.type === zieltype;

}

//Funktion um nach Timestamp zu filtern, Variable über "zieltimestamp"

function filterTimeStamp(value) {

    return value.timestamp === zieltimestamp;

}

//Funktion um nach Group_ID zu filtern, Variable über "zielgroup_id"

function filterGroupID(value) {

    return value.group_id === zielgroup_id;

}

//Funktion um nach User_ID zu filtern, Variable über "zieluser_id"

function filterUserID(value) {

    return value.user_id === zieluser_id;

}

//Initialisierung von Variablen

var auswahl = [];

var results = [];

const filename = path.join(__dirname, "../../data/IKARion_CVK_Course_T1_T6.csv");

fs.createReadStream(filename)

    .pipe(csv({separator: ";"}))

    .on('data', (data) => results.push(data))

    .on('end', () => {

        auswahl = results.filter(filterWikiEntries);

        auswahl = auswahl.filter(filterGroupID);

        auswahl = auswahl.filter(filterUserID);

        var current = auswahl.filter(filterTimeStamp);

        results = results.filter(filterWikiEntries);

        results = results.filter(filterGroupID);

        var index;

        for (var i = 0; i < results.length; i++) {

            if (results[i].timestamp == current[0].timestamp) {

                index = i;

            }

            results[i].timestamp = new Date(results[i].timestamp * 1000);

        }

        if (index == 0) {

            var text1 = '';

        } else {

            var text1 = results[i - 1].content;

        }

        var text2 = current[0].content;

        var textDiff = diff.main(text2, text1); // produces diff array

        results[index].compare = diff.prettyHtml(textDiff); // produces a formatted HTML string

    });

router.get('/', function (req, res, next) {

    res.render('spielwiese', {results: results});

});

module.exports = router;

under "// Test-Params:" i use hardcoded variables.

My /Site is linked in a timeline:

likes this:

    function getItemInfo(id) {
        if (!findObjectByKey(dataSetFürTimeLineErzeugen().concat(getAngepassteMilestones()), "id", id).content.includes("milestone")) {
            console.log("du bist jetzt in getIteminfo() mit dem id = " + id);
            var element = findObjectByKey(rese, "timestamp", id);
            if(element.type.includes("wiki"))window.open("http://localhost:3001/spielwiese/?timestamp="+element.timestamp+"&groupid="+element.group_id+"&userid="+element.user_id+"&type="+element.type);
            else window.open(element.object_id)
        }
    }

And finally my hbs file is this:

<!DOCTYPE html>

<html>

<head>

    <title>{{title}}</title>

    <link rel='stylesheet' href='/stylesheets/wiki.css'/>

</head>

<body>

<script>

    var url_string = window.location.href;

    var url = new URL(url_string);

    var zieltimestamp = url.searchParams.get("timestamp");

    var zieluser_id = url.searchParams.get("userid");

    var zielgroup_id = url.searchParams.get("groupid");

    var zieltype = url.searchParams.get("type");


    console.log(zieltimestamp);
    console.log(zieluser_id);
    console.log(zielgroup_id);
    console.log(zieltype);

</script>

{{#each results}}

    {{{this.compare}}}

{{/each}}



</body>

</html>

Now i don't know how to pass these variables from my hbs into my js script to use these variables. Console log and assigning works in the hbs file.

But i noticed that it doesn't mean they are useable in the js-file.

Guess i need another request back or something?

If i exclude my test-params, i get the error message, i would get if some variable is missing for my csv-parser.

Hope you don't need the app.js.

Also i would like to ask for some easy reference, i think i don't get the request, send framework yet.

Thank you in advance.

Cheers servierer.

Sorry for code heavy post, i dunno what is needed.

When you say "get it into my JS script," aren't these variables already created in your JS script in the code you posted? — Jacob, Aug 20 '19 at 17:51
You can find your answer here: [Pass handlebars variable to client js file](https://stackoverflow.com/questions/34997190/pass-handlebars-variable-to-client-js-file) — Navid, Jul 21 '20 at 03:33

Passing variable from handlebars to javascript in nodejs

0 Answers0