首页 > 解决方案 > 将 RTF 内容插入 Quill 会显示纯文本

问题描述

我只是试图通过 API 调用insertText()将富文本格式的内容插入到编辑器中,但是,这是作为纯文本插入的。这是故意的吗?有没有办法通过 API 将 rtf 内容插入到编辑器中?如果这不可能,请提出更好的替代方案。

我已经尝试过其他 API 调用,例如 setContent 等。我们目前正在使用 DevExpress 富文本编辑器,但是它非常慢并且对于我们当前的实现来说非常痛苦,因为它是为基于 MVC 的项目制作的,但是我们使用单个页面基于 Ember 构建的应用程序。

var quill = new Quill('#rtf-editor', {
            modules: {
                toolbar: false
            },
            theme: 'snow'
        });

        var bindingContext = this.get('bindingContext');

        quill.disable();
        quill.insertText(0, bindingContext.get('content.termsOfUseText'));

我希望富文本格式内容以所有格式出现,但它只是显示为纯文本

实际结果示例:

{\rtf1\deff0{\fonttbl{\f0 Segoe UI;}}{\colortbl ;\red0\green0\blue255 ;}{\*\defchp \fs18}{\stylesheet {\ql\fs18 Normal;}{\*\cs1\fs18 Default Paragraph Font;}{\*\cs2\sbasedon1\fs18 Line Number;}{\*\cs3\ul\fs18\cf1 Hyperlink;}{\*\ts4\tsrowd\fs18\ql\tscellpaddfl3\tscellpaddl108\tscellpaddfb3\tscellpaddfr3\tscellpaddr108\tscellpaddft3\tsvertalt\cltxlrtb Normal Table;}

这是出现在编辑器中的那种东西,以防我不够清楚。

标签: javascriptrtfquill

解决方案


参考 API 文档,Quill 似乎insertText不是执行此操作的合适方法(text参数似乎接受纯文本,而下一个参数format似乎接受需要应用于该纯文本的格式)。

目前尚不清楚您拥有的富文本具有哪种表示形式,但就 Quill 而言,它根据 Delta 来理解富文本,而我认为做您打算做的事情的一种可能方式是以某种方式拥有您的富文本转换为 HTML,然后使用 quillsdangerouslyPasteHTML方法将该 HTML 插入到编辑器中。

有关更多信息,请参阅文档:https ://quilljs.com/docs/modules/clipboard/#dangerouslypastehtml


推荐阅读