title: Simulate keypress (ctrl+v) and send the KeyboardEvent to a div in Angular2 or JavaScript
body: <p>I have a div:</p>
  
  <pre><code>&lt;div class="paste-area-content"
    #pasteDiv contenteditable="true" 
    (paste)="onPaste($event)"
    (input)="unsupportedBrowserPaste()"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>If the focus is on it and I press <kbd>Ctrl</kbd>+<kbd>V</kbd>, then call the <code>onPaste</code> function with a <code>ClipboardEvent</code> and etc., the picture from the clipboard appears in the <code>div</code>.</p>
  
  <p>Now I'd like to use a <code>&lt;button&gt;</code> to do the same process. So I thought I'd simulate the <code>keypress</code> when the button is clicked, and send the <code>KeyboardEvent</code> to the div.</p>
  
  <p>I tried a lot of similar solutions but none of them worked or they are just deprecated. The last try was:</p>
  
  <pre><code>var event = new KeyboardEvent('keypress', {
    bubbles: true,
    cancelable: true,
    ctrlKey: true,
    key : "v",
    code : "86"
  });
  this.printedArticleImagePasteComponent.simulatePaste(event);
  
  public simulatePaste(event: KeyboardEvent) {
    this.pasteDiv.nativeElement.dispatchEvent(event);
  }
  </code></pre>
  
  <p>It doesn't work of course. How is it possible to solve this?</p>
  
  <p>The second idea was: get the picture from the clipboard, create a <code>ClipboardEvent</code>  manually, set the <code>ClipboardEvent.clipboardData.items</code>. But <code>window.clipboardData.getData</code> doesn't work.</p>