Skip to content

Instantly share code, notes, and snippets.

@asuh
Last active December 10, 2016 08:39
Show Gist options
  • Save asuh/f941dcd444f294ed5a220d70df8f70c2 to your computer and use it in GitHub Desktop.
Save asuh/f941dcd444f294ed5a220d70df8f70c2 to your computer and use it in GitHub Desktop.
JS templating system
'use strict';
/*
* Javascript templating system
*/
$(document).ready(function() {
function loadTemplate(element, path, callback, done) {
$.ajax(path).then(function(html) {
element.append(html);
if (typeof callback === 'function' ) {
callback();
}
if (typeof done === 'function' ) {
done(element);
}
});
}
function loadComponent() {
var el = $(this);
var callback = $(el).data('component');
var templateName = $(el).data('template');
var template = 'components/' + templateName + '.html';
loadTemplate($(el), template, window[callback], function(element) {
// Initialize functions using data-component attributes inside markup
$(element).find('[data-component]').each(loadComponent);
});
}
// Load components
$('[data-component]').each(loadComponent);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment