I have implemented CK editor5 in my angular application. I want to insert a text at the cursor position, on clicking the text outside the editor. Please help me to achieve this in angular.
Hi, thanks for the report. If you want to insert some text at the selection, you can use code like this:
const selection = editor.model.document.selection;
const range = selection.getFirstRange();
editor.model.change ( writer => {
writer.insert( 'Some text', range.start );
} );
I'm not sure what you mean by _"clicking the text outside the editor"_. So if the above snippet is not enough, could you provide more information about what is your goal here?
Thank you. This Working as expected. Used the below code:
Html:
<form [formGroup]="formGroup">
<ckeditor #editor [config]='config' [editor]="Editor" [formControlName]="formControlName"
(ready)="setInstance($event)"></ckeditor>
<ul>
<li (click)="elementClick('Insert Text) ">Insert Text</li>
</ul>
</form>
TS:
import { CKEditorComponent } from '@ckeditor/ckeditor5-angular';
@ViewChild('editor', { static: false }) editor: CKEditorComponent;
elementClick(arg) {
const appendData = arg.;
const selection = this.editor.editorInstance.model.document.selection;
const range = selection.getFirstRange();
this.editor.editorInstance.model.change(writer => {
writer.insert(appendData, range.start);
});
}