Knockout.js привязка шаблона - вызов функции tinyMCE для загрузки предварительного просмотра

Question

Я использую KO.JS и создаю html-шаблон.

Я хочу показать TinyMCE Preview, вызвав команду предварительного просмотра в привязке html.

В общем, это то, как мы предоставляем предварительный просмотр для TinyMCE на кнопку внешней мыши:

var preview = function (divName) { 
var ID = divName 
    var myEditor = tinyMCE.editors["divName"]; 
    myEditor.execCommand("mcePreview"); 
} 

Примечание: У меня есть несколько DIVs с TinyMCE RTE, поэтому прохождение divName в качестве параметра.

Моя проблема Область:

Я хочу, чтобы сделать предварительный просмотр в DIV с помощью описанной выше функции. Я пытаюсь вызвать ту же команду в своем шаблоне.

Ниже мой код шаблона:

<script type="text/html" id="tmplPreviewModal"> 

// Lots of other bindings go here // 

// Below code should bind Tiny MCE RTE Preview to our DIV // 

<div data-bind="html : {'tinymce.get('id': 'myTxtArea').execCommand('mcePreview'); '} "></div> 

</script> 

Этот код не работает, также бросает ошибку, как показано на скриншоте ниже:

Разве это не возможно, чтобы написать мой JS код в привязка шаблона?

Я даже пытался вызова JS функции preview, как показано ниже:

Пожалуйста, предложите

Answer 1

Вы можете использовать функцию инициализации вашей ViewModel как JQuery плагин:

var ViewModel = function() { 
    var self = this; 
    //blah 
    self.init = function() { 
     tinyMCE.init({ 
      setup: function(ed) { 
       ed.onChange.add(function(ed, l) { 
        self.preview(tinymce.get('id': 'myTxtArea').getContent()); 
       }); 
      }; 
     }); 
    }; 
    self.preview = ko.observable(); 
}; 


var vm = new ViewModel(); 
ko.applyBindings(vm); 
vm.init(); 
<div data-bind="html : preview "></div> 

How to use jQuery in a Knockout.js Template?

Или вы можете использовать плагин TinyMCE-нокаут-связывающий

https://github.com/michaelpapworth/tinymce-knockout-binding

Answer 2

"html : {'tinymce.get('id': 'myTxtArea').execCommand('mcePreview'); '} " является синтаксическим нонсенс. Правая часть должна быть строковым значением, но у нее есть завитки, такие как хеш, но вместо ключа он имеет строку, обертывающую вызов функции, который сам имеет одинарные кавычки.

Моего простейшее предположения, что Curlies, крайние одинарные кавычки, а точка с запятой не принадлежат, (Update: также двоеточие должно быть запятая), так что вы хотите

"html : tinymce.get('id', 'myTxtArea').execCommand('mcePreview')"

То есть если результат execCommand является строкой HTML. Но я подозреваю, что сам TinyMCE Preview хочет манипулировать DOM, что означало бы, что для него нужен специальный обработчик привязки.