title: Remove/replace a component's selector tag from HTML
body: <p>I am getting started with the Angular 2 (version 2.0.0-alpha.46) and creating a few components.</p>
  
  <p>When creating the component with the below code:</p>
  
  <p><strong>Typescript:</strong></p>
  
  <pre><code>import {ComponentMetadata as Component, ViewMetadata as View} from 'angular2/angular2';
  
  @Component({
     selector: 'my-component'
  })
  
  @View({
       template: '&lt;div class="myClass"&gt;Hello My component&lt;/div&gt;'
   })
  
  export class MyCompoent{
      constructor() {
          console.info('My Component Mounted Successfully');
      }
  }
  </code></pre>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;my-component&gt;&lt;/my-component&gt;
  </code></pre>
  
  <p>It works fine, but when i do <code>Inspect element</code>, I can see a tag generated like this:</p>
  
  <p><strong>Output HTML</strong> </p>
  
  <pre><code>&lt;my-component&gt;
      &lt;div&gt;Hello My component&lt;/div&gt;
  &lt;my-component&gt;
  </code></pre>
  
  <p><strong>Problem</strong></p>
  
  <p>it keeps the <code>&lt;my-component&gt;</code> tag in the HTML, and some of my CSS are not working as expected.</p>
  
  <p><strong>Question</strong></p>
  
  <p>Is there a way to remove the <code>&lt;my-component&gt;</code> tag similar to angular 1 (<code>replace: true</code> in the directive)?</p>