title: How to use the 'replace' feature for custom AngularJS directives?
body: <p>Why does <code>replace=true</code> or <code>replace=false</code> not have any impact in the code below?</p>
  
  <p>Why isn't the "some existing content" being displayed when replace=false?</p>
  
  <p>Or putting it more humbly, can you kindly explain what is the <code>replace=true/false</code> feature in directives and how to use it?</p>
  
  <p><strong>Example</strong></p>
  
  <p>JS/Angular:</p>
  
  <pre><code>&lt;script&gt;
      angular.module('scopes', [])
            .controller('Ctrl', function($scope) {
                  $scope.title = "hello";
  
            })
            .directive('myDir', function() {
              return {
                restrict: 'E',
                replace: true,
                template: '&lt;div&gt;{{title}}&lt;/div&gt;'
              };
        });
  &lt;/script&gt;
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div ng-controller="Ctrl"&gt;
      &lt;my-dir&gt;&lt;h3&gt;some existing content&lt;/h3&gt;&lt;/my-dir&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>See it in Plunker here:</p>
  
  <p><a href="http://plnkr.co/edit/4ywZGwfsKHLAoGL38vvW?p=preview" rel="noreferrer">http://plnkr.co/edit/4ywZGwfsKHLAoGL38vvW?p=preview</a></p>