问题是这样
想通过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)); } } } } });