获取'ng2-ckeditor'中的光标位置

时间:2017-05-30 10:47:04

标签: javascript angular ckeditor

我是角度2的新手,并且在角度2应用程序中使用'ng2-ckeditor 1.0.7'。编辑正在使用应用程序。现在我想在光标位置附加文本。但无法使用angular2找到光标位置。我使用javascript找到了代码,但我不知道如何处理angular2 / typescript。

我的 editor.component.ts 文件是 -

@Component({
    selector: 'editor',
    template:'
      <ckeditor [(ngModel)]="ckEditorContent" [config]="ckEditorConfig"></ckeditor>

})

export class EditorComponent implements OnChanges {
    @Input() panelData: string;
    constructor() {
        this.ckEditorContent = '';
}

ckEditorContent: string;
ckEditorConfig: {} = { "uiColor": "#CFD8D3", "removeButtons": "Save,Templates,Find,Replace,Scayt,SelectAll,Smiley,Flash,SetLanguage" };

ngOnChanges(): void {

    this.ckEditorContent += this.panelData;
    console.log("this.panelData = " + this.panelData);
    console.log("this.ckEditorContent = " + this.ckEditorContent);
}

}

`

1 个答案:

答案 0 :(得分:1)

在html文件中,您实现了ckeditor标签来实现。

<ckeditor [(ngModel)]="emailWidgetTemplate.content" id="email" [readonly]="false" 
     name="content" [config]="editorConfig" (contentDom)="onContentDom($event)"></ckeditor>

类似这样的事情。在此,我实现了contentDom方法,并在ts文件中实现了它。

onContentDom(e: any) {
        console.log('try e:', e);
        this.ckeditor = e.editor;
    }

将编辑器对象分配给某些局部变量ckeditor。

单击按钮后,您可以在任何方法中使用此编辑器变量。

addText(someText){
  this.ckeditor.insertHtml(someText);
}

,它将在当前光标位置添加文本。