javascript - 如何在 Telerik 编辑器上使用 knockoutjs 绑定(bind)？

Question

我正在尝试为描述字段实现就地编辑功能，其中编辑是使用 telerik mvc 编辑器完成的。除非用户单击代表可编辑部分的跨度，否则需要隐藏编辑器，完成后，隐藏编辑器并将标记的条目放置在可编辑元素中。

我不确定在哪里应用 knockout 绑定(bind)，以便在隐藏编辑器后在 telerik 编辑器中输入的任何内容都显示在范围内。编辑器创建一个 iframe，其中包含生成的标记 html用户输入的内容。转换后的标记作为 html 编码值存储在 iframe 外部的文本区域内。

如果尝试将绑定(bind)添加到生成的文本区域，但看不到使用 data-bind = "text: imgDescr"更新绑定(bind)的跨度。

这是 Razor 式的风景

<div>
    <span data-bind="text: imgDescr"></span>
</div>
<div>
@{ Html.Telerik().Editor()
  .Name("editor")
  .HtmlAttributes(new {style = "height:400px"})
  .Encode(false)
  .Render();    
}
</div>

和js

function appViewModel() {
    this.ImgName = ko.observable(helpText);
    this.ImgDescr = ko.observable(helpText);
}

$('t-raw-content').attr('data-bind', "value: ImgDescr");

// Activates knockout.js
ko.applyBindings(new appViewModel());

关于如何做到这一点有什么建议吗？我也研究过使用 tinyMCE，但我认为渲染的处理方式类似。

Answer 1

如果您的编辑器是 tinymce 编辑器(？)，则向文本区域添加绑定(bind)没有帮助。 您可以使用 tinymce.get('editor_id').getContent(); 访问编辑器内容并使用 tinymce.get('editor_id').setContent('This is a demo文本。');