首页 > angular指令问题,多层级的require

angular指令问题,多层级的require

问题是这样

想通过angular生成一个grid,结构为
grid包含头和身体,身体包含row row包含cell
现在问题是cell指令中require部分找不到nuiGrid
代码如下,是由于我调用了$compile导致的么?
求解答


javascript_GlobalTechcompDirectives.directive('nuiCell', function($compile){
        return{
              restrict:'E',
              require: '^nuiGrid',
              template: '<td></td>',
              replace : true,
              scope : {
                cell : "=cellData"
              },
              transclude : true,
              compile: function compile(tElement, tAttrs, transclude) {
                return {
                    pre: function preLink($scope, $iElement, $attrs){
                        },
                    post:function($scope, $element,$attrs,nuirowController){
                        debugger;
                        $element.text($scope.cell.value?$scope.cell.value:'');
                        }
            }
        }
    }
    });
_GlobalTechcompDirectives.directive('nuiRow', function($compile){
        return{
              restrict:'E',
              require: '?^nuiGrid',
              template: '<tr ng-transclude></tr>',
              replace : true,
              scope : {
                row : "=rowData"
              },
              controller :function($scope, $element, $attrs){
                        //this.addwatch=nuigridController.addwatch;
              },

              transclude : true,
              compile: function compile(tElement, tAttrs, transclude) {
                return {
                    pre: function preLink($scope, $iElement, $attrs,nuigridController){
                        },
                    post:function($scope, $element,$attrs,nuigridController){
                        var tempstr='<td><input name="gridradio" type="radio"/></td>';
                        $element.append($compile(tempstr)($scope));
                        var cols=nuigridController.getColumns();
                        $scope.tempdata={};
                        $.each(cols,function(k,v){
                            $scope.tempdata={key:v,value:$scope.row.data[v]};
                            tempstr=('<nui-cell cell-data="tempdata"></nui-cell>');
                            $element.append($compile(tempstr)($scope));
                        });

                        }
            }
        }
    }
    });
_GlobalTechcompDirectives.directive('nuiGridColumns',function($compile){
        return{
              restrict:'EA',
              template: '<th ng-transclude ></th>',
              require: '?^nuiGrid',
              replace : true,
              transclude : true,
              compile: function compile(tElement, tAttrs, transclude) {
                return {
                    pre: function preLink($scope, $iElement, $attrs){
                        },
                     post:function($scope, $element,$attrs,nuigridController,transclude){
                        if($attrs.bindname!=""&&$attrs.bindname!="undefined"&&$attrs.bindname!=null){
                            nuigridController.addColumn($attrs.bindname);
                        }
                        }
            }
        }

    }

    });
_GlobalTechcompDirectives.directive('nuiGrid',function($compile){
        var type="grid";
        return{
              restrict:'E',
              template: '

<table class="table table-bordered table-hover table-striped table-top"><thead><tr ng-transclude></tr></thead><tbody></tbody></table>

',
              replace : true,
              transclude : true,
              controller :function($scope, $element, $attrs){
                            this.columns=[];
                            this.addColumn=function(bind){
                                this.columns.push(bind);    
                            };
                            this.getColumns=function(){
                            return this.columns;
                            };
                            this.addwatch = function(bind,func){
                                if(bind=="undefined"){}
                                else{
                                    $scope.$watch('bind.data.'+bind,func);
                                }
                            };
                            this.getbind = function(e){
                                return $scope.bind.data[e];
                            }

              },
              compile: function compile(tElement, tAttrs, transclude) {
                return {
                        pre: function preLink($scope, $iElement, $attrs){
                        $attrs.$set("nuitype",type);
                        $scope.bind={};
                        $scope.bind.data={};
                        if($attrs.id!=""&&$attrs.id!="undefined"&&$attrs.id!=null){
                        $attrs.$set("id",$scope.view_main_id+"_"+$attrs.id);
                        };

                        },
                     post:function($scope, $element,$attrs,nuiformController,transclude){
                            debugger;
                            var str="<nui-row ng-repeat='row in bind.data' row-data='row'></nui-row>"
                            $element.children().last().append($compile(str)($scope));
                        }
            }
        }

    }

    });

【热门文章】
【热门文章】