如何在ngx-ckeditor中使用insertText方法 angular 7

Question

我在我的项目中使用 angular 8，我正在尝试实现 ngx-CKEditor。我需要在编辑器中添加自定义文本，这应该会发生当我单击列表时，我需要在 CKEditor 中添加内容。

我尝试使用此代码但对我不起作用。

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

在ts文件中

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

ts文件中的点击事件

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

我收到一个错误：ERROR TypeError: Cannot read property 'instances' of undefined

Answer 1

尝试使用 {static: false}:

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

false表示解析after change detection。

更新：

您需要在 .ts 和 .html（带有 # 符号的名称）文件中使用相同的名称：

HTML:

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

打字稿：

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

并像这样使用它：

this.myEditor.instance.insertText(value);

如何在ngx-ckeditor中使用insertText方法 angular 7

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

javascript

ckeditor

ckeditor4.x

angular