Directive to disable Cut, Copy and Paste function for textbox using Angular2

Question

I am using Angular2 to restrict the copy and paste in textbox. But how do i write a custom directive, so that it will be easy to apply for all the text fields.

Below

Answer 1

You can use Renderer to listen to cut,copy,paste events and call preventDefault() in your directive something like

@Directive({ selector: '[preventCutCopyPaste]' })

export class CopyDirective {
    constructor(el: ElementRef, renderer: Renderer) {
      var events = 'cut copy paste';
      events.split(' ').forEach(e => 
      renderer.listen(el.nativeElement, e, (event) => {
        event.preventDefault();
        })
      );

    }
}

Then in html

Working Demo