如何像在 Wysiwyg 中一样在 Quill 中添加 "show html" 按钮?

How do I add "show html" button in Quill like in Wysiwyg?

我最近发现了 Quill 文本编辑器,因为我正在玩 php 和 javascript 中的新东西,所以我决定在我的应用程序中使用它而不是 Wysiwyg。

Quill 文档非常简约。如何添加允许用户显示和编辑当前 html 的按钮?

我是否必须扩展 Quill 并自己制作一个?

如果您检查以下 link,您会发现它们没有将 HTML 按钮的选项添加到配置列表键。可能,您必须扩展库。 http://quilljs.com/docs/configuration/ 是 link 配置页面。

在 API 调用列表中,我看到您可以执行函数调用以从插件中获取 HTML。你可以在下面的link中找到它。函数名叫做getHTML()。因此,您可能必须通过创建自己的按钮和显示区域来扩展库。

嗯,这在 3 年后仍然是个问题。

所以我做了一个小模块来完成这个。

https://github.com/benwinding/quill-html-edit-button

我在 Angular 应用程序中使用 quill,所以我所要做的就是使用 [(ngModel)] 将 quill 编辑器的内容包装在“pre”标签中,并添加到 ngx-highlightjs添加一些语法颜色的模块:

<pre><code [highlight]="content"></code></pre>

如果您使用的是普通 javascript,您可以创建一个简单的按钮,用您的编辑器中的内容填充“pre”标签。