How to disable typing but allow copy and paste in a text box in Angular 8?

Question

I want to restrict typing in a text box but I need to paste anything inside that textbox in Angular

Answer 1

You have to stop the event propagation if the combination pressed is different than the one you choose.

You can do it like this:

public onInput(event: KeyboardEvent) {
  //if is pressed a different key than c or v, or the ctrl key isn't pressed stop event
  if (!event.ctrlKey || (event.key.toLowerCase() !== 'c' && event.key.toLowerCase() !== 'v')) {
    event.stopImmediatePropagation();
    event.stopPropagation();
    event.preventDefault();
  } 

  // else execute the default event behaviour
}

<input type="text" (keydown)="onInput($event)">

Hope it helps. ^^

P.S.: You have to use the event keydown for this to work.