CkEditor5 insertContent函数不工作

我试图使用insertContent方法，但出现了一些错误

这是我的实现

<div id="editor">
    <p>This is the editor content.</p>
</div>
<button onclick="update()">update</button>

<script src="./node_modules/@ckeditor/ckeditor5-build-classic/build/ckeditor.js"></script>
<script>
    var editorInstance;
    ClassicEditor
        .create(document.querySelector('#editor'))
        .then(editor => {
            editorInstance = editor;
        })
        .catch(error => {
            console.error(error);
        });

    function update() {
        editorInstance.model.insertContent("<p><b>Test</b> Content</p>")
    }
</script>

这是编辑器的内容

更新
var编辑机构；
分类编辑器
.create（document.querySelector（'#editor'））
.然后（编辑=>{
editorInstance=编辑；
})
.catch（错误=>{
控制台错误（error）；
});
函数更新（）{
editorInstance.model.insertContent（“测试内容”
”）
}

update方法应该用给定的内容更新编辑器源代码，但我得到一个错误

控制台上的错误：

未捕获类型错误：e.is不是函数 在xc.Nm处（converters.js:777） 在xc.fire（emittermixin.js:209） 在xc。[作为插入内容]（见emixin.js:259） 更新时（ck5.html:19） 在HTMLButtonElement.onclick上（ck5.html:4）

---

是否有人可以帮助解决此问题？

此错误似乎是由于尝试使用

insertContent

方法插入HTML造成的-此方法默认情况下似乎需要纯文本字符串，尽管我们可以通过一些额外步骤使其接受HTML

首先，您需要获取HTML数据处理器：

const htmlDP = editorInstance.data.processor;

接下来，您需要使用我们刚刚获得的HTML数据处理器将HTML字符串转换为viewFragment：

const viewFragment = htmlDP.toView("<p><b>Test</b> Content</p>");

现在我们可以将modelFragment传递给

insertContent

方法：

editorInstance.model.insertContent(modelFragment);

---

这将删除错误并允许将标记字符串插入编辑器中

此错误似乎是由于尝试使用

insertContent

方法插入HTML引起的-此方法默认情况下似乎需要纯文本字符串，尽管我们可以通过一些额外步骤使其接受HTML

首先，您需要获取HTML数据处理器：

const htmlDP = editorInstance.data.processor;

接下来，您需要使用我们刚刚获得的HTML数据处理器将HTML字符串转换为viewFragment：

const viewFragment = htmlDP.toView("<p><b>Test</b> Content</p>");

现在我们可以将modelFragment传递给

insertContent

方法：

editorInstance.model.insertContent(modelFragment);

这将删除错误并允许将标记字符串插入编辑器