CODEWITHSUNDEEP
javascripthandlebars.jstemplate-engine
Robin Johansson
Robin Johansson

Reputation: 80

Handlebars.js wont compile/output my template/data

I'm playing around with Handlebars.js and trying to compile a small template. I am only using Handlebars.js and nothing more. I am working locally on my computer, and not via any form of server.

my "html" looks like this. nothing special.

<!doctype html>
<html>
    <head>
        <script src="js/vendor/handlebars.min-4.0.4.js"></script>
    </head>
    <body>
        <script id="menu-template" type="text/x-handlebars-template">
            <h1>{{title}}</h1>
        </script>


        <section id="menu">

        </section>


        <script src="js/menu.js"></script>
    </body>
</html>

And my JS is

var source = document.getElementById('menu-template').innerHTML;
var template = Handlebars.compile(source);
var data = {title: "test"};

document.getElementById('menu').innerHTML = template(data);

It seems that template() does not return anything, i don't get any result except what looks like a empty string.

And i have been playing around with this for a few hours and searching the internet for answers but no result.

Am i doing anything wrong here?

// Edit added the rest of the html page.

Upvotes: 0

Views: 743

Answers (1)

Airwind711
Airwind711

Reputation: 120

The code seems correct just make sure the Handlebars.js file is properly included before the existing script tag.

Ref for Handlebars CDN : https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.4/handlebars.js

Upvotes: 1

Related Questions