app.component.html

<dx-html-editor valueType="html">
    <dxo-toolbar [multiline]="true">
        <dxi-item name="undo"></dxi-item>
        <dxi-item name="redo"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="size" [acceptedValues]="['8pt', '10pt', '12pt', '14pt', '18pt', '24pt', '36pt']"></dxi-item>
        <dxi-item name="font" [acceptedValues]="['Arial', 'Georgia', 'Tahoma', 'Times New Roman', 'Verdana']"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="bold"></dxi-item>
        <dxi-item name="italic"></dxi-item>
        <dxi-item name="strike"></dxi-item>
        <dxi-item name="underline"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="alignLeft"></dxi-item>
        <dxi-item name="alignCenter"></dxi-item>
        <dxi-item name="alignRight"></dxi-item>
        <dxi-item name="alignJustify"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="orderedList"></dxi-item>
        <dxi-item name="bulletList"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="header" [acceptedValues]="[false, 1, 2, 3, 4, 5]"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="color"></dxi-item>
        <dxi-item name="background"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="link"></dxi-item>
        <dxi-item name="image"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="clear"></dxi-item>
        <dxi-item name="codeBlock"></dxi-item>
        <dxi-item name="blockquote"></dxi-item>
        <dxi-item name="separator"></dxi-item>
        <dxi-item name="insertTable"></dxi-item>
        <dxi-item name="deleteTable"></dxi-item>
        <dxi-item name="insertRowAbove"></dxi-item>
        <dxi-item name="insertRowBelow"></dxi-item>
        <dxi-item name="deleteRow"></dxi-item>
        <dxi-item name="insertColumnLeft"></dxi-item>
        <dxi-item name="insertColumnRight"></dxi-item>
        <dxi-item name="deleteColumn"></dxi-item>
        <dxi-item name="cellProperties"></dxi-item>
        <dxi-item name="tableProperties"></dxi-item>
    </dxo-toolbar>
    <dxo-media-resizing
        [enabled]="true">
    </dxo-media-resizing>
    <dxo-table-context-menu
        [enabled]="true">
    </dxo-table-context-menu>
    <h2>
        <img src="assets/images/HtmlEditor.svg" alt="HtmlEditor">
        Rich Text Editor (HTML Editor)
    </h2>
    <br>
    <p>DevExtreme JavaScript HTML Editor is a client-side WYSIWYG editor that allows its users to format textual and visual content and output it as HTML or Markdown.</p>
    <p>Supported features:</p>
    <ul>
        <li>Inline formats:
            <ul>
                <li><strong>Bold</strong>, <em>italic</em>, <s>strikethrough</s> text formatting</li>
                <li>Typeface, font size, text color changes (HTML only)</li>
            </ul>
        </li>
        <li>Block formats:
            <ul>
                <li>Headers</li>
                <li>Lists (ordered and unordered)</li>
                <li>Code blocks</li>
                <li>Quotes</li>
            </ul>
        </li>
        <li>Built-in format customization</li>
        <li>HTML and Markdown support</li>
        <li>Mail Merge</li>
        <li>Adaptive toolbar for working with images, links, and color formats</li>
        <li>Copy-paste rich content (the control strips unsupported formats)</li>
        <li>Embedded images specified as a link to an image file or as base64-encoded binary data</li>
        <li>Mention (for example, @person)</li>
        <li>Tables</li>
    </ul>
    <br>
    <p>The editor supports the following frameworks and libraries:</p>
    <table>
        <tr>
            <td><strong>jQuery</strong></td>
            <td>v3.x</td>
        </tr>
        <tr>
            <td><strong>Angular</strong></td>
            <td>v7.0.x - v11.0.x</td>
        </tr>
        <tr>
            <td><strong>React</strong></td>
            <td>v16.2+</td>
        </tr>
        <tr>
            <td><strong>Vue</strong></td>
            <td>v2.6.3+</td>
        </tr>
    </table>
</dx-html-editor>