javascript - ng-transclude 显示元素两次

Question

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

我以为我理解了嵌入，但这让我很困惑。

这是一个小提琴

<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>