CKEditor新实例始终处于卸载状态

CKEditor New Instance always unloaded

本文关键字：于卸载 卸载 状态 新实例 实例 CKEditor      更新时间：2023-09-26

我在我的Angular应用程序中使用CKEditor，每次用户访问新模型时，我都会有一个视图重新加载我的CKEditor实例。

我正在使用以下JS初始化编辑器：

var initEditor = function() {
  $('.js-editor-wrap').html("<textarea id='editor'></textarea>");
  var editor = CKEDITOR.replace('editor', {});
  editor.on('loaded', function() {
    console.log('editor loaded');
  });
  editor.on('instanceReady', function() {
    console.log('instance ready')
  });
}

和以下销毁编辑器：

var destroyEditor = function() {
  if (CKEDITOR.instances['editor']) {
    CKEDITOR.instances['editor'].destroy(true);
    $('#editor').off().remove();
  }
}

第一次编辑器初始化的工作与预期的一样，但随后的初始化会创建一个状态为"unloaded"的编辑器实例，该实例永远不会触发"loaded"或"instanceReady"事件。我在控制台中没有看到任何错误。

你知道是什么原因造成的吗？

这肯定是一个类似于下面的问题，但不同之处在于，我认为它有自己的问题：CKEditor实例已经存在

经过更多的挖掘，多亏了Jey Dwork的jsfiddle，我发现了问题所在。我的CKEditor配置文件添加了几个插件，这些插件引用了命名不正确的lang文件。出于某种原因，当这些插件被包含在一起时，它们会导致编辑器在第二次初始化时无法完全加载。

删除lang文件并在插件定义中引用它们解决了这个问题。遗憾的是，没有引发任何错误。不过结局好就好。

相关文章：