CKEditor, initialize widget added with insertElement(CKEditor,初始化使用 insertElement 添加的小部件)
问题描述
我创建了一些小部件,它们在初始启动时加载正常,但我通过以下方式将更多此类小部件添加到编辑器:
I have some widgets created, they on initial startup they load fine, but i add more of this type of widget to the editor through:
ckeditorInstance.insertElement(
CKEDITOR.dom.element.createFromHtml('<html></html>'));
它插入得很好,但 ckeditor 无法识别作为小部件插入的元素,因此小部件可编辑字段没有像应有的那样启用.
It inserts just fine, but the ckeditor does not recognize the element inserted as a widget, so the widget editable fields are not getting enabled like they should.
有什么方法可以让 ckeditor 重新扫描其内容以初始化它尚未初始化的任何新小部件?
Is there any way to make ckeditor do a rescan of its content to initialize any new widgets that it has not already initialized?
推荐答案
数据格式
首先 - 小部件的数据格式(小部件如何在数据中表示)和内部格式(它如何在编辑器中表示)是分开的.您可能熟悉 upcast和 downcast 函数 - 它们使这些格式之间的转换(向上转换意味着将数据格式转换为内部格式).
Data formats
First of all - there's a separation for data format of a widget (how widget is represented in data) and internal format (how it is represented in editor). You may be familiar with the upcast and downcast functions - they make the transition between those formats (upcasting means transforming data format to internal format).
仅当数据 string 被处理时,向上转换和向下转换才有效,但如果您使用 editor#insertElement
插入内容,则没有处理,因此没有向上转换.
Upcasting and downcasting work only if data string is processed, but if you insert content using editor#insertElement
there's no processing, so there's no upcasting.
您有两种解决方案:
使用
editor#insertHtml代码> 而不是
editor#insertElement
.您的小部件将在插入之前向上转换,因此它会以良好的格式插入.
Use
editor#insertHtml
instead ofeditor#insertElement
. Your widget will be upcasted before insertion, so it will be inserted in a good format.
自己负责向上转换(如果需要)并使用 editor#insertElement
.
Take care of upcasting (if needed) yourself and use editor#insertElement
.
正在初始化
这是小部件生命的第一步 - 它必须被插入.二是被初始化.
Initializing
This was a first step of widget's life - it has to be inserted. Second is to be initialized.
目前有一个 错误(它会两周内修复),由
insertHtml
方法插入的小部件未初始化.因此,此时,在使用editor#insertHtml
插入小部件后,您需要调用:
There's a bug currently (it will be fixed in two weeks), that widgets inserted by the
insertHtml
method are not initialized. So, at this moment, after inserting widget witheditor#insertHtml
you need to call:
editor.widgets.checkWidgets()
如果您使用 editor#insertElement
,您需要注意初始化小部件.要进行该调用:
If you use editor#insertElement
you need to take care of initializing widget. To do that call:
editor.widgets.initOn(元素,'widgetName')
在这两种情况下插入后初始化小部件.
查看 Widgets API 了解更多详情.
Check out the Widgets API for more details.
另请参阅我的回答 解释如何知道一个元素是否是一个小部件以及如何将它们插入到编辑器中.
这篇关于CKEditor,初始化使用 insertElement 添加的小部件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:CKEditor,初始化使用 insertElement 添加的小部件
基础教程推荐
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 直接将值设置为滑块 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01