title: Angular 2: Implement a custom context menu
body: <p>I'm implementing an Angular 2 attribute directive to allow me to add a custom context menu to an element like this:</p>
  
  <pre><code>&lt;p context-menu="myItems"&gt;Hello world&lt;/p&gt;
  </code></pre>
  
  <p>That directive adds a mouse event handler to catch a right-click, and the idea is to then construct a context menu, add it to the DOM, and then destroy it when the user finishes with it.</p>
  
  <p>I have a component that implements the context menu itself. I'd like to construct that component, call a method on it to set the item list, and then add it to the DOM.</p>
  
  <p>It looks like I might be able to do this with AppViewManager.createHostViewInContainer. Is this an appropriate way to do this? And if so, is there a way to construct/get an ElementRef to <code>document.body</code> so that I can tell createHostViewInContainer to construct the component there? Obviously I don't want my menu to be clipped inside the element I'm adding the context menu to.</p>