ERROR The renderer Content is not found

[gorge]

Hello,

I'm trying to custom a cell grid in edit dialog mode with richtextbox but I have "ERROR The renderer Content is not found" when i'm edit row.

myComponent.ts: 

     this.contentParams = {
            create: () => {
                this.elem = document.createElement('input');
                return this.elem;
            },
            read: () => {
                return this.richTextBoxObj.value;
            },
            destroy: () => {
                this.richTextBoxObj.destroy();
            },
            write: (args: { rowData: any, column: Column }) => {
                this.richTextBoxObj = new RichTextEditor({
                    value: args.rowData[args.column.field],
                    inlineMode: this.inlineMode,
                    toolbarSettings: this.toolbarSettings,
                    format: this.format,
                    fontFamily: this.fontFamily
                });
                this.richTextBoxObj.appendTo(this.elem);
            }
        };

in html Template :

 <e-column field='Contenu' headerText='Contenu' [edit]='contentParams' width='120'></e-column>

[Hariharan J V]

Hi Gorge, 

 

Thanks for contacting Syncfusion support. 

 

We have validated the reported issue and this issue will happen when EJ2-RichTextEditor module is not injected properly. Please refer the below code snippets.  

 

               

 

    import { RichTextEditor, Toolbar, Link, Image, HtmlEditor, QuickToolbar } from '@syncfusion/ej2-richtexteditor'; 

    RichTextEditor.Inject(Toolbar, Link, HtmlEditor, Image, QuickToolbar); 

 

 

 

Please find the sample for your reference. 

 

Sample : http://www.syncfusion.com/downloads/support/directtrac/general/ze/grid-ng-sample615770100.zip  

 

 

Note: If you used EJ2-RichTextEditor component in Grid template, you need to customize the following css(because row height will be changed after save the record so we need to customize ) in your application. 

 

 

[app.component.css]  

  

  ::ng-deep .e-rowcell p { 

        line-height: 0; 

        margin: 0; 

    } 

 

 

 

Regards, 

Hariharan