How can I create simple view engine like Mustache, so that the word between the {{ }} is replaced by its value, like:
<p>hey there {{ codeName }}</p>
codeName = 'JavaScript 6'
so that it be converted to:
<p>hey there JavaScript 6</p>
How can I create simple view engine like Mustache, so that the word between the {{ }} is replaced by its value, like:
<p>hey there {{ codeName }}</p>
codeName = 'JavaScript 6'
so that it be converted to:
<p>hey there JavaScript 6</p>
I found the below to be proper way to understand it:
var templater = function(html){
return function(data){
for(var x in data){
var re = "{{\\s?" + x + "\\s?}}";
html = html.replace(new RegExp(re, "ig"), data[x]);
}
return html;
};
};
var template = new templater("<p>hey there {{ codeName }}</p>");
var div = document.createElement("div");
div.innerHTML = template({
codeName: "JavaScript 6"
});
document.body.appendChild(div);
reference is here