title: How to use `replace` of directive definition?
body: <p>In this document: <a href="http://docs.angularjs.org/guide/directive" rel="noreferrer">http://docs.angularjs.org/guide/directive</a> , it says that there is a <code>replace</code> configuration for directives:</p>
  
  <blockquote>
    <p><strong>template</strong> - replace the current element with the contents of the HTML. The replacement process migrates all of the attributes / classes from the old element to the new one. See the Creating Components section below for more information.</p>
  </blockquote>
  
  <p><strong>javascript code</strong></p>
  
  <pre><code>app.directive('myd1', function(){
    return {
      template: '&lt;span&gt;directive template1&lt;/span&gt;',
      replace: true
    }
  });
  
  app.directive('myd2', function(){
    return {
      template: '&lt;span&gt;directive template2&lt;/span&gt;',
      replace: false
    }
  });
  </code></pre>
  
  <p><strong>html code</strong></p>
  
  <pre><code>&lt;div myd1&gt;
    original content should be replaced
  &lt;/div&gt;
  &lt;div myd2&gt;
    original content should NOT be replaced
  &lt;/div&gt;
  </code></pre>
  
  <p>But the final page is looking like:</p>
  
  <pre><code>directive template1
  directive template2
  </code></pre>
  
  <p>It seems the <code>replace</code> doesn't work. Do I miss anything?</p>
  
  <p>Live demo: <a href="http://plnkr.co/edit/rGIgmjO81X2UxJohL4HM?p=preview" rel="noreferrer">http://plnkr.co/edit/rGIgmjO81X2UxJohL4HM?p=preview</a></p>