angular 自定义指令 repeat bind 怎么不能同时作用在同一元素上-PHP中文网问答

如题，自己写了两个指令，想作用在同意元素下，先进行repeat，后进行bind，但目前，仅第一个执行bind

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>angular</title>
    <script src="http://cdn.bootcss.com/angular.js/1.2.10/angular.min.js"></script>
</head>
<body ng-app="app">
    <div ng-controller="test">
            <input type="text" ng-model="msg">
            <div lxc-bind="msg" lxc-reapeat="3">123123</div>
            <!-- <div lxc-reapeat="3">lxc</div> -->
    </div>
    <script>
        angular.module('app',[])
        .controller('test',function($scope){
                $scope.msg = 'test';
        })
        .directive('lxcBind',function(){
            // Runs during compile
            return {
                restrict: 'A', // E = Element, A = Attribute, C = Class, M = Comment
                link: function($scope, iElm, iAttrs, controller) {
                        $scope.$watch(iAttrs.lxcBind,function(newValue){
                                iElm.text(newValue);
                        })
                }
            };
        })
        .directive('lxcReapeat',function(){
            return {
                restrict:'A',
                priority: 1000,
                link:function($scope,$elm,$attr){
                    var repeatNum = $attr.lxcReapeat;
                    for (var i=repeatNum-2;i>= 0;i--){
                         var dom = $elm.clone();
                         $elm.after(dom);
                    }
                }
            }
        })
    </script>
</body>
</html>

angular.module('app',[]) // 注入 $compile 服务，用来动态编译 .directive('lxcReapeat',function($compile){ return { restrict:'A', priority: 1000, link:function($scope,$elm,$attr){ var repeatNum = $attr.lxcReapeat; for (var i=repeatNum-2;i>= 0;i--){ var dom = $elm.clone(); // 删除 lxc-reapeat 属性，否则动态编译会造成死循环。理解这点很重要 dom.removeAttr('lxc-reapeat'); // 动态编译并连接到scope var ele = $compile(dom)($scope); $elm.after(ele); } } } })

nbsp;html> angular

123123