how to use the insertText method in ngx-ckeditor angular 7

user_9361329 0
Viewed 628

I'm using angular 8 in my project and I'm trying to implement ngx-CKEditor. I need to add custom text in the editor this should happen When I click the list I need to add the content inside the CKEditor.

i tried with this code but not working for me.

<ck-editor name="editor" #myEditor [(ngModel)]="editorValue" skin="moono-lisa" language="en" [fullPage]="true"></ck-editor>

<ul>
        <li (click)="selectText('adasdasd1')">adasdasd1</li>
        <li (click)="selectText('adasdasd2')">adasdasd2</li>
    </ul>

In ts file 

public editorValue;
@ViewChild("editor", { static: true }) myEditor: any;

click event in ts file 

selectText(value) {
    this.myEditor.instances.insertText(value);
  }

I am getting an error: ERROR TypeError: Cannot read property 'instances' of undefined

ckeditor4.x angular ckeditor javascript
1 Answers

Try to use with {static: false}:

@ViewChild("editor", { static: false }) myEditor: any;

false means that it resolves after change detection.

UPDATE:

You need to use the same name in .ts and .html (name with # sign) files:

HTML:

<ck-editor name="editor" #myEditor [(ngModel)]="editorValue" 
     skin="moono-lisa" language="en" [fullPage]="true"></ck-editor>

TypeScript:

 @ViewChild("myEditor", { static: false }) myEditor: any;

and use it like this:

this.myEditor.instance.insertText(value);
user_16462400
Related