自定义 ng-transclude-replace 指令

directive('ngTranscludeReplace', ['$log', function ($log) {
    return {
        terminal: true,
        restrict: 'EA',
        link: function ($scope, $element, $attr, ctrl, transclude) {
            if (!transclude) {
                $log.error('orphan',
                    'Illegal use of ngTranscludeReplace directive in the template! ' +
                    'No parent directive that requires a transclusion found. ');
                return;
            }
            transclude(function (clone) {
                if (clone.length) {
                    $element.replaceWith(clone);
                } else {
                    $element.remove();
                }
            });
        }
    };
}]);

原来ng-transclude生成的dom结构

<div>
    <span ng-transclude>
        ......
    </span>
</div>

替换之后的结构

<div>
    ......
</div>