MathJax + Knockout.js Подписка

Question

Я использую knockout.js для динамической вставки значений на основе вызова Ajax. Одним из этих значений, content.front, является текст utf8, который может содержать выражения MathJax. Я пытаюсь понять, как заставить MathJax отображать выражения каждый раз, когда knockout.js обновляет div. Я не могу заставить его работать, и я не знаю, почему. Вот JavaScript:

var ViewModel = function(data) { 
    var self = this; 
    self = ko.mapping.fromJS(data, {}, self); 
    self.content.back.subscribe(function() { 
     MathJax.Hub.Queue(["Typeset", MathJax.Hub,"preview-back"]); 
    }); 
}; 

и Гамлет:

<div .wrap> 
    <div .tab-content> 
    <div .tab-pane #preview-back data-bind="text: content.back"> 

(HTML, этот Гамлет делает действует HTML 5 ...)

Как можно заметить, knockout.js является оказание текст в соответствующем div. И когда я меняю текст, div тоже меняется. И MathJax, похоже, срабатывает - появляется всплывающее окно «Набирает 100%». Но div не меняется.

Answer 1

Хорошо, поэтому я закончил создание пользовательского переплета для нокаута. Я использую JQuery здесь, тоже:

ko.bindingHandlers.mathjax = { 
    update: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) { 
    // This will be called once when the binding is first applied to an element, 
    // and again whenever the associated observable changes value. 
    // Update the DOM element based on the supplied values here. 
    var value = valueAccessor(), allBindings = allBindingsAccessor(); 

    var valueUnwrapped = ko.unwrap(value); 
    // the replace is an artefact of my encoding. Maybe I will use markdown instead. 
    $(element).html(valueUnwrapped.replace(/\n/g, '<br>')); 
    MathJax.Hub.Queue(["Typeset",MathJax.Hub,element]); 
    } 
}; 

ViewModel остается тем же самым, и шаблон HTML является:

 <div data-bind="mathjax: content.back"></div> 

Надеюсь, это поможет кто-то другой!