Question

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

我不确定应用敲除绑定的位置，以便在编辑器被隐藏后在跨度中显示输入到telerik编辑器中的内容。编辑器创建一个iframe，其中包含生成的标记html用户输入的内容。转换后的标记将作为html编码值存储在iframe外部的textarea中。

如果尝试向生成的textarea添加绑定，但看不到与data-bind =“text：imgDescr”更新绑定的跨度。

她是剃刀的观点

<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编辑器（？），那么在textarea中添加绑定是没有用的。您可以使用tinymce.get('editor_id').getContent();访问编辑器内容，并使用tinymce.get('editor_id').setContent('This is a demo text.');

进行设置

Answer 2

使用列出here和here的示例以及knockout wiki here提供的tinyMCE的绑定示例，我能够以我需要的方式绑定编辑器。

我缺少的部分是jquery.tinymce.js脚本。

绑定是在自定义绑定中完成的，如上例所示，绑定所需的唯一行是

   setTimeout(function() { $(element).tinymce(options); }, 0);

在自定义绑定的init部分中。

这是我所拥有的jsfiddle。这不是jsFiddle中的完整工作示例，而是显示我在页面上的所有内容。

如何在Telerik编辑器上使用knockoutjs绑定？

2 个答案: