Как использовать `replace` в определении директивы?

В этом документе: http://docs.angularjs.org/guide/directive говорится, что есть replaceконфигурация для директив:

шаблон - заменить текущий элемент содержимым HTML. В процессе замены все атрибуты / классы переносятся из старого элемента в новый. См. Раздел «Создание компонентов» ниже для получения дополнительной информации.

код javascript

app.directive('myd1', function(){
  return {
    template: '<span>directive template1</span>',
    replace: true
  }
});

app.directive('myd2', function(){
  return {
    template: '<span>directive template2</span>',
    replace: false
  }
});

HTML-код

<div myd1>
  original content should be replaced
</div>
<div myd2>
  original content should NOT be replaced
</div>

Но последняя страница выглядит так:

directive template1
directive template2

Кажется replace, не работает. Я что-нибудь упускаю?

Живая демонстрация: http://plnkr.co/edit/rGIgmjO81X2UxJohL4HM?p=preview

Вы запутались с тем transclude: true, что добавит внутреннее содержимое.

replace: trueозначает, что содержимое шаблона директивы заменит элемент, для которого объявлена ​​директива, в данном случае <div myd1>тег.

http://plnkr.co/edit/k9qSx15fhSZRMwgAIMP4?p=preview

Например без replace:true

<div myd1><span class="replaced" myd1="">directive template1</span></div>

и с replace:true

<span class="replaced" myd1="">directive template1</span>

Как вы можете видеть в последнем примере, тег div действительно заменен .

Как указано в документации, «replace» определяет, заменяется ли текущий элемент директивой. Другой вариант - добавить ли он просто как дочерний элемент. Если вы посмотрите на источник своего plnkr, обратите внимание, что для второй директивы, где replace имеет значение false, тег div все еще существует. Для первой директивы это не так.

Первый результат:

<span myd1="">directive template1</span>

Второй результат:

<div myd2=""><span>directive template2</span></div>

Заменить [True | False (по умолчанию)]

Эффект

1.  Replace the directive element. 

Зависимость:

1. When replace: true, the template or templateUrl must be required. 

Также я получил эту ошибку, если у меня был комментарий на верхнем уровне шаблона среди фактического корневого элемента.

<!-- Just a commented out stuff -->
<div>test of {{value}}</div>