Example of Use Case in Angular Rich Text Editor Component

This sample demonstrates how to design forum application using Rich Text Editor. You can type the content and click reply button to post it.

Kimberly
How to add a custom item to the toolbar of Rich Text Editor
Posted on May 7, 2018 6.10 PM
I want to add a custom icon, “code-mirror” to the toolbar of Rich Text Editor and display the Rich Text Editor content in code-mirror format.
HTML
JavaScript
likeLikedislikeDislike
1 Answer
Mabel Weber
Answered on May 7, 2018 6.30 PM
To add a custom icon code-mirror to the toolbar, you have to use template option of the toolbarSettings. To know more about adding custom icons, refer to custom tool sample of Rich Text Editor.
LikeDislike
Description

Rich Text Editor is a WYSIWYG editing control which will reduce the effort for users while trying to express their formatting word content as HTML or Markdown format. So, Rich Text Editor can easily customized to use for blog posting, forums as an editor for response.

Injecting Module

Rich Text Editor features are segregated into individual feature-wise modules. In this demo we have used following injectable services ToolbarService, LinkService, ImageService, HtmlEditorService, QuickToolbarService, PasteCleanupService into the @NgModule.providers section.