CKeditor span doesn't apply

Viewed 13

I'm trying to use CKeditor, the problem is when I try to add color it doesn't work because when I console.log I get spans that don't work.

Is there any way to make it work?

html

<form [formGroup]="form">
  <ckeditor #t ckeditorContent="toto" formControlName="content">
  </ckeditor>
</form>

<div [innerHTML]="t.value"></div>

in my console

<span style="color:#e74c3c">&eacute;&#39;r&eacute;&quot;&#39;zfzervzervzsefvzerfvzrvzrz</span>

ckeditor config.js

    CKEDITOR.editorConfig = function (config) {
  // The configuration options below are needed when running CKEditor from source files.
  config.plugins =
    "dialogui,dialog,about,a11yhelp,dialogadvtab,basicstyles,bidi,blockquote,notification,button,toolbar,clipboard,panelbutton,panel,floatpanel,colorbutton,colordialog,xml,ajax,templates,menu,contextmenu,copyformatting,div,editorplaceholder,resize,elementspath,enterkey,entities,exportpdf,popup,filetools,filebrowser,find,floatingspace,listblock,richcombo,font,fakeobjects,forms,format,horizontalrule,htmlwriter,iframe,wysiwygarea,image,indent,indentblock,indentlist,smiley,justify,menubutton,language,link,list,liststyle,magicline,maximize,newpage,pagebreak,pastetext,pastetools,pastefromgdocs,pastefromlibreoffice,pastefromword,preview,print,removeformat,save,selectall,showblocks,showborders,sourcearea,specialchar,scayt,stylescombo,tab,table,tabletools,tableselection,undo,lineutils,widgetselection,widget,notificationaggregator,uploadwidget,uploadimage";
  config.skin = "office2013";
  config.language = "fr";
  config.autoParagraph = false;

  config.toolbarGroups = [
    { name: "clipboard", groups: ["clipboard", "undo"] },
    {
      name: "editing",
      groups: ["find", "selection", "spellchecker", "editing"],
    },
    { name: "forms", groups: ["forms"] },
    { name: "basicstyles", groups: ["basicstyles", "cleanup"] },
    {
      name: "paragraph",
      groups: ["list", "indent", "blocks", "align", "bidi", "paragraph"],
    },
    { name: "links", groups: ["links"] },
    { name: "insert", groups: ["insert"] },
    "/",
    { name: "styles", groups: ["styles"] },
    { name: "colors", groups: ["colors"] },
    { name: "tools", groups: ["tools"] },
    { name: "others", groups: ["others"] },
    { name: "about", groups: ["about"] },
  ];


  config.removeButtons =
    "Source,Save,Form,HiddenField,ImageButton,Button,Select,Textarea,TextField,Radio,Checkbox,BidiLtr,BidiRtl,Language,CreateDiv,Link,Unlink,Anchor,Image,Flash,PageBreak,Iframe,Scayt,Maximize,ShowBlocks,About,Print,Preview,NewPage,Templates";
0 Answers
Related