Paste html content as plain text in contenteditable div using AngularJs

Question

I want to paste text selected from a certain document(pdf, docx, html), into a div of contenteditable type.

Now I want to remove all the formatting of the clipboard text before it is rendered. So, the final content pasted should be a plain text.

An analogue of this scenario can be pasting content into Windows Notepad.

How could this be done using AngularJs. Or there exist any other javascript library to acomplish this.

Update: I can use the following code to get the clipboard as a text.

editor.addEventListener("paste", function(e) {
    // cancel paste
    e.preventDefault();

    // get text representation of clipboard
    var text = e.clipboardData.getData("text/plain");

    // insert text manually
    document.execCommand("insertHTML", false, text);
});

But i dont know how and where to add this code in AngularJs.

Pasting to html text-area acts same way as pasting to notepad... — Petr Averyanov, Jan 01 '15 at 18:36
but what behaviour u expect? User selects something in ms-word, then go to your page and Ctrl-v it in div? o_O — Petr Averyanov, Jan 01 '15 at 20:42

score 0 · Answer 1 · edited May 23 '17 at 10:31

0

Check this answer out, you can capture paste events. Doesn't matter if it's content editable div or otherwise.

JavaScript get clipboard data on paste event (Cross browser)

edited May 23 '17 at 10:31

Community

1
1

answered Jan 02 '15 at 00:55

Peter Ashwell

4,062
1
16
22

I am able to get clipboard data. I would like to remove the formatting from it, to get plain text out of that. – jsbisht Jan 02 '15 at 09:55

Paste html content as plain text in contenteditable div using AngularJs

1 Answers1