ng-transclude 两次显示元素

Question

为什么这个 transcluded 指令重复 Name inside directive = Frank 两次？

我以为我理解嵌入，但这让我感到困惑。

Here's a fiddle

<div ng-app="myApp" ng-controller="myController">
    <my-directive>Name in outer controller scope = {{name}}<my-directive/>
</div>


var app = angular.module("myApp", []);
app.controller("myController", function ($scope) {
    $scope.name = 'George';
});
app.directive("myDirective", function () {
    return {
        restrict: 'E',
        scope: {},
        transclude: true,

        template:   '<div ng-transclude></div>' +
                    '<span>Name inside directive = {{name}}</span>',

        link: function (scope) {
            scope.name = 'Frank'
        }
    };
});

Answer 1

只是因为你没有正确关闭标签

</my-directive> 而不是 <my-directive/>

Answer 2

打错了：

<my-directive>Name in outer controller scope = {{name}}</my-directive>