ng-repeat and ng-transclude's trap

<!DOCTYPE html>
<html ng-app="appModule">
<head lang="en">

    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.css" rel="stylesheet">
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://code.angularjs.org/1.3.0-rc.4/angular.js"></script>
    <script src="app.js"></script>
    <script src="directiveTransclude.js"></script>
    <script src="directiveRepeat.js"></script>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<div ng-controller="mainController">
    <div class="bg-danger">
      <h4>This is maninController's content</h4>
      main's items->{{items}}
    </div>
    <div class="bg-info">
        <h4>This is transclude demo</h4>
        <transclude-test>
            transclude's items->{{items}}
        </transclude-test>
    </div>
    <!------------------------------------------------------------->
    <div class="bg-success">
        <h4>This is repeat demo</h4>
        repeat's items->
        <repeat-template>
            {{dataItem}}
        </repeat-template>
    </div>
</div>
</body>
</html>

(function(){
    angular.module('appModule',['repeatModule','transcludeModule'])
        .controller('mainController',function($scope){
            $scope.items = ['a','b','c','d','e','f']
        })
})()

(function(){
    angular.module('transcludeModule',[])
        .directive('transcludeTest',function(){
            return{
                restrict: 'E',
                scope:{},//isolate scope can use binding to get parent's value
                template: '<div ng-transclude></div>',
                transclude: true,
                link: function(scope,element,attrs,parentCtrl,transcludeFn){
                    scope.items = ['This','is','transcludeDirective','text']
                    transcludeFn(scope,function(clone){//in order to show isolate scope content
                        element.empty();
                        element.append(clone);
                    })
                }
            }
        })
})();

(function(){
    angular.module('repeatModule',[])

        .directive('repeatTemplate',function(){
            return{
                restrict: 'E',
                scope: {//isolate-scope
                    
                },
                template: '<li ng-repeat="dataItem in items"  inject>' +
                          '</li>',
                transclude: true,
                replact: true,
                link: function(scope,element,attrs,ctrl,transcludeFn){
                  scope.items = ['a','b','c'];
                }
            }
        })
        .directive('inject', function () {
            return {
                restrict: 'A',
                link: function (scope, element, attrs, ctrl, transcludeFn) {//目的使transclude的內容使用到isolate-scope,e.g{{item}}
                    if (!transcludeFn) return;
                    transcludeFn(scope, function (clone) {
                        element.empty();
                        element.append(clone);
                    });
                }
            };
        });
})();