Search code examples
javascripthandlebars.jspartial

Conditional load of a partial in handlebars based on current url


I'd like to load a handlebars partial, but only when the URL is '/foo', and load a different partial for '/bar'.

I know that this is always going to be a bit of a hack, and not really intended - but use to the project handlebars structure, it seems the most logical way of solving the problem I'm running into.

Thanks


Solution

  • assuming

    • jquery is included
    • your template files are in the same folder
    • your template files have the names "foo.bs" & "bar.hbs"

    code

    function loadTemplate(templateName) {
        $.get(templateName + '.hbs', function (data) {
            var template = Handlebars.compile(data);
            $(body).html(template(jsonData));
        }, 'html');
    }
    
    if (window.location.pathname.search('bar') !== -1) {
        loadTemplate('bar');
    }
    if (window.location.pathname.search('foo !== -1) {
        loadTemplate('foo');
    }