Paste html content as plain text in contenteditable div using AngularJs [duplicate]

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.

Anissaanita

Pasting to html text-area acts same way as pasting to notepad... – Tonsillotomy

Yeah but for certain reasons i have to use a div. – Anissaanita

but what behaviour u expect? User selects something in ms-word, then go to your page and Ctrl-v it in div? o_O – Tonsillotomy

@PetrAveryanov Yes, thats what i am looking for. – Anissaanita

Answer 1

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)

Renelle

I am able to get clipboard data. I would like to remove the formatting from it, to get plain text out of that. – Anissaanita