5 回答

• 1

  既然我有同样的问题，我在这里分享我的研究结果：

  ng2-ckeditor

  演示here

  

  ngx-editor

  演示here

  

  quill.js用于角度

  演示here

  注意：Quill使用JSON在内部存储数据，而不是html .

  

  PRIME NG

  主题集合，其中包含基于Quill的WYSIWYG编辑器，演示here . 一些主题是免费的 .

  ngx-md

  使用MarkDown而不是HTML的WYSIWYG编辑器，演示here

  Edit

  如果你选择的是quill.js，你可能想要使用KillerCodeMonkey's implementation，因为它与angular 5兼容 .

  回复于 2024-04-28T22:22:39+08:00
• 4

  为Andular 6（原生）尝试这个简单但功能强大的WYSIWYG编辑器

  AngularEditor

  注意：使用Angular CLI v6.0.5将此本机Angular 6 WYSIWYG编辑器创建为库 .

  

  演示是here

  欢迎PR或新功能请求 .

  已知错误：Google Chrome bug（如果contenteditable的内容为空（WYSIWYG），则禁用下划线不起作用）

  这个编辑器最初是作为我的公司项目https://kassar.ru/的一部分创建的，但是我将它解压缩到单独的库中并作为开源项目发布 . 我希望这可以帮助别人解决他们的问题 .

  回复于 2024-04-28T22:22:39+08:00
• 32

  你可以使用ng2-editor . 它有许多管理选项 .

  https://github.com/chymz/ng2-ckeditor

  回复于 2024-04-28T22:22:39+08:00
• 11

  感谢@Ronin分享您的研究成果 . 以下是我对我测试的一对夫妇的反馈 .

  NGX-EDITOR

  首先我尝试了ngx-editor，并且相对容易安装和使用 . 只需要ngs-boostrap和fontAwesome作为依赖项 . 然而，我发现我的要求的唯一缺点是添加链接小部件 . 此库不记得您输入的链接，因此如果您想要更改它们，则需要删除并重新添加它 . 另一个限制是无法指定最大长度值 .

  NGX-QUILL

  我最终使用ngx-quill . 它有更好的方法来处理链接以及指定max-Length的能力 . 它也很容易安装：

  npm install ngx-quill
  npm install quill  // Needed for CSS styles
  
  import { QuillModule } from 'ngx-quill'
  import 'quill/dist/quill.core.css'
  import 'quill/dist/quill.snow.css'
  
  @NgModule({
    imports: [
      ...,
  
      QuillModule
    ],
    ...
  })
  class YourModule { ... }
  

  回复于 2024-04-28T22:22:39+08:00
• 4

  我在Angular4项目中使用“ngx-quill”作为WYSIWYG编辑器 .

  这是富文本编辑器Quill的Angular（> = 2）组件

  angular v4 - ngx-quill <=1.6.0
  angular v5 - ngx-quill > 1.6.0
  angular v6 - ngx-quill >= 3.0.0
  

  • demo-page
    tool bar image

  回复于 2024-04-28T22:22:39+08:00