DocumentEditor - Copy/Paste from outside the browser | Angular Forums

Cezary Szacherski

Asked On December 30, 2019 09:33 AM UTC

Hello,
I have a problem with DocumentEditor control in Angular. I'am trying to handle copying/pasting for example from MS Word application but I can't find enough documentation/information about this functionality so I have a few questions:

1.Where I can find some sample code/sample application or any documentation which is connected with copy/paste functionality from outside the browser? (What's more your sample -> LINK is not working for me also - after pasting text copied from MS Word there is infinite spinner)
2. To handle that functionality do we need some extra backend implementation?

3. Is SSL needed in application which has this control implemented to get it working properly? (we've set up SSL)

4. Do we need any special configuration on client browsers (Chrome, Firefox) to get it working ?

Thank you for any help !

Reply | Reply with quote

Harini Chellappa [Syncfusion]

Replied On December 31, 2019 11:02 AM UTC

Hi Cezary,

Syncfusion Greetings!

In Document editor, we have a property called enableLocalPaste. This property decides to switch between the local copied content in document editor and clipboard content on paste.

Property	DocumentEditorContainer component	DocumentEditor component
enableLocalPaste(default value)	true	false

When the property is true, outside content i.e. clipboard contents cannot be pasted in document editor. If it sets to false, you can paste outside contents in document editor.

Please refer the below documentation for more details.

https://ej2.syncfusion.com/angular/documentation/document-editor/clipboard/#paste

if you are using document editor container, then by default enableLocalPaste will be set to true and local copied contents alone will be pasted. In toolbar, we have “Local Clipboard” option.

By toggling this option in toolbar, enableLocalPaste property will be toggled.

You can also set this property to false on document editor container component.

Please refer the below sample link

https://stackblitz.com/edit/angular-kv2rxc-n3zlmp?file=app.component.html

To handle that functionality do we need some extra backend implementation?	Yes. Pasting outside contents in document editor involves server communication. In server side, please ensure to add systemclipboard web API in controller. https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices/blob/master/ASP.NET%20Core/src/Controllers/DocumentEditorController.cs#L109 Please refer the following GitHub source for web services platform-wise. ASP.NET CORE https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices/tree/master/ASP.NET%20Core ASP.NET MVC https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices/tree/master/ASP.NET%20MVC
Is SSL needed in application which has this control implemented to get it working properly? (we've set up SSL)	No. there is no need for SSL to get it work.
Do we need any special configuration on client browsers (Chrome, Firefox) to get it working?	There is no other special configuration needed in browsers.

Regards,

Harini C

Reply | Reply with quote

Cezary Szacherski

Replied On January 2, 2020 10:03 AM UTC

Thank you for your answer, it helped me a lot. But I have one more question - is there possibility to add custom headers to request which is send to server after pasting.
Our backend API needs some extra header information to properly work with request.

Reply | Reply with quote

Harini Chellappa [Syncfusion]

Replied On January 3, 2020 12:58 PM UTC

Hi Cezary,

Yes, it is possible to add custom headers.

For that you can set header information in headers property. Please refer the below documentation.

https://ej2.syncfusion.com/angular/documentation/api/document-editor-container#headers

https://ej2.syncfusion.com/angular/documentation/api/document-editor#headers

Sample Code Snippet

documentEditorContainerInstance.headers = [{‘Custom-Header’ : ‘Token2’ }]; ;

documentEditorInstance.headers = [{‘Custom-Header’ : ‘Token2’ }];

Sample link

https://stackblitz.com/edit/angular-ygkgoe-rlapre?file=app.component.ts

Please let us know if you need any further assistance.

Regards,

Harini C

Reply | Reply with quote

Thread ID:	Created:	Updated:	Platform:	Replies:
150271	Dec 30,2019 09:33 AM UTC	Jan 3,2020 12:58 PM UTC	Angular - EJ 2	3

DocumentEditor - Copy/Paste from outside the browser

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US