为什么replace=true还是replace=false没有在下面的代码产生任何影响？

当replace = false时为什么不显示“某些现有内容”？

或者更谦虚地讲，您能否解释replace=true/false指令中的功能以及如何使用它？

例

JS /角度：

<script>
    angular.module('scopes', [])
          .controller('Ctrl', function($scope) {
                $scope.title = "hello";

          })
          .directive('myDir', function() {
            return {
              restrict: 'E',
              replace: true,
              template: '<div>{{title}}</div>'
            };
      });
</script>

HTML：

<div ng-controller="Ctrl">
    <my-dir><h3>some existing content</h3></my-dir>
</div>

在此处查看Plunker：

http://plnkr.co/edit/4ywZGwfsKHLAoGL38vvW?p=preview

拥有后，replace: true您将获得以下DOM：

<div ng-controller="Ctrl" class="ng-scope">
    <div class="ng-binding">hello</div>
</div>

而随着replace: false你得到这个：

<div ng-controller="Ctrl" class="ng-scope">
    <my-dir>
        <div class="ng-binding">hello</div>
    </my-dir>
</div>

因此replace，伪指令中的属性是指（<my-dir>在这种情况下）要应用伪指令的元素是否应保留（replace: false），并且伪指令的模板应作为其子元素追加，

要么

应用指令的元素应由指令的模板替换（replace: true）。

在这两种情况下，元素的子元素（将对其应用指令）都将丢失。如果您想保留元素的原始内容/子元素，则必须对其进行转义。可以使用以下指令：

.directive('myDir', function() {
    return {
        restrict: 'E',
        replace: false,
        transclude: true,
        template: '<div>{{title}}<div ng-transclude></div></div>'
    };
});

在这种情况下，如果在指令的模板中有一个具有attribute的元素（或多个元素）ng-transclude，则其内容将被该元素（对其应用指令）的原始内容替换。

请参见翻译示例http://plnkr.co/edit/2DJQydBjgwj9vExLn3Ik?p=preview

请参阅此内容以了解有关音译的更多信息。

replace:true 已弃用

从文档中：

replace （[DEPRECATED！]将在下一个主要版本中删除，即v2.0）

指定模板应替换的内容。默认为false。

• true -模板将替换指令的元素。
• false -模板将替换指令元素的内容。

- AngularJS综合指令API

从GitHub：

Caitp-之所以弃用，是因为存在已知的，非常愚蠢的问题replace: true，实际上并不能以合理的方式解决其中的许多问题。如果您小心谨慎并避免了这些问题，那么将为您带来更多的功能，但是对于新用户来说，告诉他们“这会让您头疼，不要这样做”会更容易。

- AngularJS问题＃7636

更新资料

注意：replace: true不推荐使用，不建议使用，主要是由于此处列出的问题。在新的Angular中已将其完全删除。

替换问题：true

• 属性值未合并
• 伪指令在编译之前不会进行重复数据删除
• transclude: element 替换模板根目录中的内容可能会产生意想不到的效果

有关更多信息，请参见

• AngularJS $ compile服务API参考-问题 replace:true