Auto-updating templates within contenteditable div

Question

I have a contentEditable div element, within which i am inserting an underscore template with the document.execCommand method:

var data = {a: 100, b: 200};

var info = _.template('<span><%= data.a %>,<%= data.b %></span>');

document.execCommand('insertHTML', false, info({'data': data}));

This is working as expected. I am now looking for a way to have this span element update automatically when the data source changes. Is there a way to do that?

Answer 1

Just in case it's useful to anyone, here is how i have done it-

1) Added an events firing/subscription mechanism to the data source. 2) Fire a 'change' event on any data changes. 3) Handle the change event with a function that resets the html of the corresponding element within the contenteditable element.

Still looking for a more elegant solution though.