0

我正在使用 Angular 10 并包含 ngx quill 编辑器来显示富文本编辑器。当我们将 html 内容保存到数据库中时，它会以 html 类类型保存，如下所示：

<li class="ql-indent-2">lbmlkfdnblblfdsb</li>

当我们通过我们的应用程序发送电子邮件时，我们在电子邮件正文中发送上述内容，但 css 类将不可用。因此它不显示样式。我们如何在 Angular 中实现这一点？

我尝试了下面的代码并没有得到任何运气：

https://github.com/quilljs/quill/issues/1451

<quill-editor #body name="body" id="body" [(ngModel)]="studyNotification.messageText" (onSelectionChanged)="editorSelectionChanged($event)"
        (onEditorCreated)="editorCreated($event)" [style]="{height: '250px', background: 'white'}">
       
         <div id="toolbar-container"  quill-editor-toolbar>                
            <!-- Text Size  -->
           <span class="ql-formats">
             <select class="ql-font"></select>
             <select class="ql-size"></select>
           </span>
           <!-- Text Formatting  -->
           <span class="ql-formats">
             <button class="ql-bold"></button>
             <button class="ql-italic"></button>
             <button class="ql-underline"></button>
             <button class="ql-strike"></button>
           </span>
           <span class="ql-formats">
             <select class="ql-color"></select>
             <select class="ql-background"></select>
           </span>
             <!-- Subscript/superscript  -->
           <span class="ql-formats">
             <button class="ql-script" value="sub"></button>
             <button class="ql-script" value="super"></button>
           </span>
           <!-- Text Block format -->
              <!-- Header Sizes  -->
           <span class="ql-formats">
             <button class="ql-header" value="1"></button>
             <button class="ql-header" value="2"></button>
             <!-- <button class="ql-blockquote"></button>
             <button class="ql-code-block"></button> -->
           </span>
            <!-- Ordered List / Bullets   -->
             <!--  Indenting -->
           <span class="ql-formats">
             <button class="ql-list" value="ordered"></button>
             <!-- <button class="ql-list" value="bullet"></button> -->
             <button class="ql-indent" value="-1"></button>
             <button class="ql-indent" value="+1"></button>
           </span>
          <span class="ql-formats">
            <!--   <button class="ql-direction" value="rtl"></button> -->
             <select class="ql-align"></select>
           </span>
           <span class="ql-formats">
             <button class="ql-link"></button>
             <button class="ql-image"></button>
             <button class="ql-video"></button>
             <!-- <button class="ql-formula"></button> -->
           </span>
           <!-- <span class="ql-formats">
             <button class="ql-clean"></button>
           </span> -->
         </div>
      
       </quill-editor>
4

0 回答 0