Search results

Clipboard support

Document editor takes advantage of system clipboard and allows you to copy or move a portion of the document into it in HTML format, so that it can be pasted in any application that supports clipboard.

Copy

Copy a portion of document to system clipboard using built-in context menu of document editor. You can also do it programmatically using the following sample code.

 this.documentEditor.selection.copy();

Cut

Cut a portion of document to system clipboard using built-in context menu of document editor. You can also do it programmatically using the following sample code.

 this.documentEditor.editor.cut();

Paste

Due to limitations, you can paste contents from system clipboard as plain text in document editor only using the ‘CTRL + V’ keyboard shortcut.

Local paste

Document editor expose API to enable local paste within the control. On enabling this, the following is performed:

  • Selected contents will be stored to an internal clipboard in addition to system clipboard.
  • Clipboard paste will be overridden, and internally stored data that has formatted text will be pasted. Refer to the following sample code.
import { Component, ViewEncapsulation, ViewChild } from '@angular/core';
import {
    DocumentEditorComponent, EditorService, SelectionService, SfdtExportService, EditorHistoryService, BookmarkDialogService
} from '@syncfusion/ej2-angular-documenteditor';

@Component({
    selector: 'app-container',
    template: `<div style="width:100%;height:330px"><button ejs-button (click)="pasteLocal()" >Paste local</button>
    <ejs-documenteditor #document_editor  id="container" style="width:100%;height:100%;display:block" [isReadOnly]=false [enableEditor]=true [enableLocalPaste]=true>
    </ejs-documenteditor></div>`,
    encapsulation: ViewEncapsulation.None,
    providers: [EditorService, SelectionService, SfdtExportService]
})

export class AppComponent {
 @ViewChild('document_editor')
 public documentEditor: DocumentEditorComponent;

 public pasteLocal() :void {
    this.documentEditor.showDialog('Bookmark');
 }

}

By default, enableLocalPaste is false. When local paste is enabled for a document editor instance, you can paste contents programmatically if the internal clipboard has stored data during last copy operation. Refer to the following sample code.

 this.documentEditor..editor.pasteLocal();

See Also