用tinymce綁定敲除

我正在嘗試使用knockout 3.0.0和tinymce 4.0.18。用tinymce綁定敲除

我想創造一些東西like this：很少可編輯的元素（3這裏），但這些元素都是從淘汰賽中獲得的。這樣做沒有tinyMCE不是問題（這裏是my attempt）。

但是，當我嘗試做這樣的事情來達到同樣的result with tinyMCE：

function ViewModel() { 
    var self = this; 
    self.editableAreas = ko.observableArray([{ 
     id : 1, 
     txt: ko.observable('first text area'), 
    },{ 
     id : 2, 
     txt: ko.observable('second text area'), 
    },{ 
     id : 3, 
     txt: ko.observable('all observable text area'), 
    }]); 
} 

ko.applyBindings(new ViewModel()); 

tinymce.init({ 
    selector: "div.editableArea", 
    schema: "html5", 
    inline: true, 
    toolbar: "bold italic underscore", 
    menubar: false 
});

谷歌搜索有點大，我發現了兩個自定義綁定了tinyMCE（first結合和second）。這是最好的方法，我如何修改我的小提琴按預期工作？

來源

2014-03-01 Salvador Dali

使用bindingHandler將DOM元素綁定到視圖模型是「正確的」方法。只需包含您鏈接的bindingHandlers之一即可。我updated your jsfiddle using the second bindingHandler（隨機選擇，因爲我沒有偏好，因爲我不知道他們中的任何一個）。包括之後bindingHandler（和jQuery和它似乎取決於jquery.tinymce.min.js）我更新了HTML以下內容，以便使用bindingHandler：

<div data-bind="foreach: editableAreas"> 
    <div class="editableArea" data-bind="wysiwyg: txt, wysiwygConfig: {  
     schema: 'html5', 
     inline: true, 
     toolbar: 'bold italic underscore', 
     menubar: false 
    } "></div> 
</div>

在這種情況下，我有tinymce配置在視圖中。如果你想把它作爲viewModel中的一個屬性，它應該很容易改變它（例如以下code）

來源

2014-03-01 12:58:52

謝謝你的幫助。我正在嘗試在viewModel中移動配置，但我無法理解如何輕鬆地做到這一點。事實上，我沒有做到這一點。如果你能告訴我我該怎麼做，我會非常感激。 –

我已經更新了小提琴（http://jsfiddle.net/jY3X2/7/）以提供作爲視圖模型屬性的選項。 –

哇，你真了不起。謝謝！ –

用tinymce綁定敲除

回答

相關問題