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

techie18 :

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

StepUp :

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);

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=12221&siteId=1